通过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. SpringMVC中重定向底层原理

      只要将数据放入model中, 也能取到值,原因是model临时放入session域中,当从定向到另一个url时,底层把数据拼接在url地址后面(重定向一定是get请求方式),同时将session域 ...

  2. ICC_lab总结——ICC_lab2:设计规划

    PS:字丑,禁止转载!!! 首先先写出大概的流程,然后是一些教材的理论知识总结,最后是进行lab2的一些流程概述. 教材的理论知识总结主要是:数字集成电路物理设计学习总结--布图规划和布局 --> ...

  3. Parallel.For 你可能忽视的一个非常实用的重载方法

    说起Parallel.For大家都不会陌生,很简单,不就是一个提供并行功能的for循环吗? 或许大家平时使用到的差不多就是其中最简单的那个重载方法,而真实情况 下Parallel.For里面有14个重 ...

  4. Windows上安装Kafka需要注意的几点

    1.不能安装在有空格的路径上 比如:D:\Program Files 2.设置日志路径时,要用"/",不能用Windows上的"\",比如: # A comma ...

  5. 计算两个date类型的时间差

    //两个时间之间分钟差 public static int compareDate(Date d1, Date d2) {        // TODO Auto-generated method s ...

  6. unity3d屏蔽Windows10输入法

    在win10上,如果安装了某些输入法(比如QQ输入法),会造成unity的键盘事件被输入法捕获而不能触发的情况.只有将输入法切换到英文状态下才能响应键盘事件. 解决办法有, 1:用户主动切换输入法,甚 ...

  7. Tomcat源码分析(一)

    这段时间简单的看了一下Tomcat的源码,在这里做个笔记!   1. tomcat 架构图 Catalina: tomcat的顶级容器,main()方法中就是通过,创建Catalina 对象实例,来启 ...

  8. Javascript 闭包访问问题?

    function pfajax(paradata){ $.ajax({ data : paradata.dat, type : paradata.method, async: false, url : ...

  9. 编写你的第一个程序(HelloWorld)

    1)安装. 2)打开我们的编译工具Xcode,会出现一些选项,我们只需要选中第2项(因为版本不同可能有些不同)“Create a new Xcode project ”如下图(其他的选项目前我们还没有 ...

  10. POPTEST老李分享修改dns ip的vbs代码

    POPTEST老李分享修改dns ip的vbs代码   poptest是国内唯一一家培养测试开发工程师的培训机构,以学员能胜任自动化测试,性能测试,测试工具开发等工作为目标.如果对课程感兴趣,请大家咨 ...