通过vue-cli创建的工程,默认已经打好了基础,包含vue-loader webpack。

通常我们开发中,使用npm run dev进行开发,webpack会Hot reload,不用我们手动刷新浏览器,很是方便。

但是真正部署的时候,需要使用npm run build命令。

这一步命令会压缩代码,打指纹等等。

可以看到dist目录下是这样的目录结构

原来的static目录内的文件,会原样不动上传到dist的static目录下。

/index.html

/static

----/img

----/js

-------/app.83992983.js

-------/vendor.dklajdkfjwer.js

------/ 更多

---/更多文件省略

生产环境下,生成的dist目录下的文件,上传到服务器的www目录下面就可以了。

放到apache或者nginx下面都可以,或者node服务器都可以。如果是node,需要使用nginx代理node的端,也就是配置Location啦,不懂得前端同学可以问问后台。

Vue项目的部署的更多相关文章

  1. vue项目如何部署到Tomcat中

    vue项目如何部署到Tomcat中 1,假设你要访问的项目名称为'hms' 2,在Tomcat的webapps下创建hms文件夹, 3,配置config/index.js文件,build: {} 选项 ...

  2. 【转】vue项目打包部署——nginx代理访问

    我又来了,今天部署了下vue项目,使用nginx做了代理,这样可以解决跨域的问题,这里做一个简单讲解. 1.先看vue项目打包(我这里使用的是vscode开发工具) 这里是我的项目结构: 打包之前需要 ...

  3. vue项目 打包部署上线

    1. npm run dev:本地开发的时候做调试用的. 2. npm run build:打包部署上线,生成一个 dist 文件夹. 注意:用 npm run build 时,常遇到因引用路径不对导 ...

  4. Vue路由器的hash和history两种工作模式 && Vue项目编译部署

    1 # 一.Vue路由器的两种工作模式 2 # 1.对于一个uri来说,什么是hash值? 井号及其后面的内容就是hash值. 3 # 2.hash值不会包括含在HTTP请求中,即:hash值不会带给 ...

  5. Vue项目打包部署到apache服务器

    vue项目在开发环境下,让项目运行起来,是通过npm run dev命令,原理是在本地搭建了一个express服务器. 但是在服务器上就不是这样的,必须要通npm run build命令来对整个项目进 ...

  6. vue项目打包部署elementUI的字体图标丢失问题

    自己搭建的Vue项目,没有使用vue-cli,引入elementUI时,使用的是webpack直接打包工具,发现字体图标丢失你 记录一下解决办法: webpack module配置:(build目录下 ...

  7. vue项目打包 部署nginx服务器 访问远程接口 本地json 跨域问题

    本文建立在你已经在windows7上已经配好了nginx的前提下进行!!! 如果没有请移步至:https://www.cnblogs.com/jack1208-rose0203/p/5739765.h ...

  8. vue项目打包部署到服务器,静态资源文件404

    js文件404问题        原因:打包的项目静态资源的路径需要设置为绝对路径.如果是相对路径会出错 解决办法:修改config/index.js文件,将 assetsPublicPath修改为' ...

  9. vue项目打包部署到nginx 服务器上

    假如要实现的效果如下 http://ip/vue    =>是进入首页访问的路径是  usr/local/nginx/html/vue http://ip/website     =>是进 ...

随机推荐

  1. linux 根分区扩展

    linux根分区扩容 今天网站上传图片出问题了,一开始还以为是程序问题,后来发现原来是服务器存储空间不够,明明有200G的磁盘空间,没理由这么快就用完,查了一下分区情况,原来有两块磁盘,根分区只挂载在 ...

  2. iOS开发之判断系统版本

    if([[UIDevice currentDevice].systemVersion doubleValue]>=7.0) { //是IOS7至以上版本 }else{ //IOS7以下版本 }

  3. MyBatis原始dao开发及问题总结(五)

    一.MyBatis原始Dao开发方式 1.原始dao开发需要程序员编写dao接口和dao接口实现类 编写UserDao接口:UserDao.java package codeRose.dao; pub ...

  4. [Openfire]使用WebSocket建立Openfire的客户端

    近日工作闲暇之余,对IM系统产生了兴趣,转而研究了IM的内容.找了半天,知道比较流行的是Openfire的系统,Openfire有许多平台实现,由于我是做Web的,所以当然是希望寻找Web的实现.Op ...

  5. Linux中的grep命令

    grep - print lines matching a pattern 参数: -a 将binary文件以text文件的方式查找 -i 忽略大小写 --color=zuto 加颜色匹配字符串 -v ...

  6. CDN,你了解多少?

    大家对CDN并不陌生,工作中或多或少都有所接触,最近也有人问到,在此对CDN相关概念和流程做下总结,希望还能对其他朋友也有所帮助. 一.什么是CDN 维基百科上是这样定义的: CDN:内容分发网络(C ...

  7. js精确计算

    官方文档:http://mikemcl.github.io/big.js/ 使用方法: x = new Big(0.1); y = x.plus(0.2); // '0.3' var a=Big(0. ...

  8. taobao-pamirs-proxycache开源缓存代理框架实现原理剖析

    写在前面 taobao-pamirs-proxycache 是一款开源缓存代理框架, 它将 缓存代码 与 业务代码 解耦.让开发专注coding业务, 缓存通过xml配置即可实现.本文先从此工具如何使 ...

  9. Lvs工作原理

    DR模式的工作过程: 当一个client发送一个WEB请求到VIP,LVS服务器根据VIP选择对应的real-server的Pool,根据算法,在Pool中选择一台Real-server,LVS在ha ...

  10. PHPCMSV9上线方法及文件权限设置

    上线步骤: a.替换代码和数据库文件内的域名b.修改cache/configs/database.php中的数据库密码c.修改cache/configs/system.php文件中的网站路径变量 'w ...