1.进入到项目根目录执行

npm run build

此时会自动打包在dist目录下

2.安装服务

npm  install -g serve

3.启动

serve dist

总结:

以上就是生产环境打包的过程。

npm run dev是开发环境,

npm run build是生产环境

VUE生产环境打包build的更多相关文章

  1. Vue生产环境部署

    前面的话 开发时,Vue 会提供很多警告来帮助解决常见的错误与陷阱.生产时,这些警告语句却没有用,反而会增加载荷量.再次,有些警告检查有小的运行时开销,生产环境模式下是可以避免的.本文将详细介绍Vue ...

  2. Vue生产环境调试的方法

    vue 生产环境默认是无法启用vue devtools的,如果生产应用出了问题,就很难解决.. 原理 先说下vue如何判断devtools是否可用的. vue devtools扩展组件会在window ...

  3. Vue 生产环境部署

    简要:继上次搭建vue环境后,开始着手vue的学习;为此向大家分享从开发环境部署到生产环境(线上)中遇到的问题和解决办法,希望能够跟各位VUE大神学习探索,如果有不对或者好的建议告知下:*~*! 一. ...

  4. vue分环境打包配置不同命令

    1.安装cross-env (cross-env能跨平台地设置及使用环境变量)cnpm/npm  i  cross-env -D 2.新建模板 红色的为相关文件 3.配置各个文件 (1)config下 ...

  5. vue分环境打包配置方法一

    直接上代码配置: 首先是config下面的文件修改 dev.env.js  'use strict' const merge = require('webpack-merge') const prod ...

  6. vue生产环境清除console.log

    npm run build 后的生产环境的代码,会有很多开发时留下的console.log(),不可能每个页面不停地删除 在build/webpack.prod.conf.js文件里加上这样一段代码即 ...

  7. Vue 生产环境(production) 打开 调试工具的方法

    总所周知,在production生产环境下,点击vue插件会显示, 并且按F12是没办法使用调试工具的,这样非常不方便 其实是有一个办法的,那就是复制下面的js,然后在控制台执行 代码中已经写清楚执行 ...

  8. vue 多环境打包

    https://cli.vuejs.org/zh/guide/mode-and-env.html#%E6%A8%A1%E5%BC%8F 模式 模式是 Vue CLI 项目中一个重要的概念.默认情况下, ...

  9. vue 生产环境 background 背景图不显示原因

    通常我们使用img标签引入文件,npm run build 打包后 ,因为img为html标签,打包后他的路径是由index.html开始访问的,他走static/img/'图片名'是能正确访问到图片 ...

随机推荐

  1. LC 593. Valid Square

    Given the coordinates of four points in 2D space, return whether the four points could construct a s ...

  2. WebLogic服务器

    WebLogic是美国Oracle公司出品的一个application server确切的说是一个基于JAVAEE架构的中间件,BEA WebLogic是用于开发.集成.部署和管理大型分布式Web应用 ...

  3. 07 MySQL之视图

    01-视图的含义 视图是从一个或者多个表中导出的,视图的行为与表非常相似,但视图是一个虚拟表.视图还可以从已经存在的视图的基础上定义. 02-创建视图 # 基本语法格式: CREATE [OR REP ...

  4. Latex新手学习

    1.Latex 套装下载安装 http://www.ctex.org/CTeXDownload 选择镜像稳定版 下载安装后 2.一个简单的例子 (1)打开WinEdt (2)新建一个文档 \docum ...

  5. Netflix Zuul

    Zuul 是在云平台上提供动态路由,监控,弹性,安全等边缘服务的框架.Zuul 相当于是设备和 Netflix 流应用的 Web 网站后端所有请求的前门. ApiGateway服务器 1.pom &l ...

  6. vue项目报错

    在项目根目录下的.eslintrc.js中的rules下添加以下内容: /*代表不用eslint检测代码规范*/ "useEslint":false, /* tab和空格混用缩进, ...

  7. Spring策略模式的实现

    场景: 有时候一个业务方法有多个实现类,需要根据特定的情形进行业务处理. 例如:商店支付,我们可以使用支付宝.微信扫描农行.xxx行的快捷支付(而不是微信支付.支付宝支付二维码)购买商品. 实现代码( ...

  8. Linux命令集锦:chmod命令

    chmod命令是用来变更文件或目录的权限. 权限范围的表示法如下: u:User,即文件或目录的拥有者: g:Group,即文件或目录的所属群组: o:Other,除了文件或目录拥有者或所属群组之外, ...

  9. vue中使用raphael.js实现地图绘制

    一.效果图 二.在vue中引入raphael.js npm i raphael -S 三.封装一个名为StreetMap的组件,代码如下 <template> <div> &l ...

  10. IntelliJ IDEA打jar时常遇见的问题

    1.打包的时候提示 manifest.mf already exists in vfs  解决方案:这个文件夹删除掉,再重新build打包即可 2. 第一个选择“extract to the targ ...