vue项目打包上线

vue项目开发完毕后，我们需要将项目打包上线，同时我们希望可以在本地预览生产环境项目。（以下以vue-cli脚手架生成的项目为例）

发布服务器

1、运行打包命令

npm run build
复制代码

运行后生成dist文件夹,将dist文件夹发布在服务器中，over搞定

本地预览打包后的项目

运行打包命令后，可以看到命令行提示以下信息 Tip: built files are meant to be served over an HTTP server. Opening index.html over file:// won't work.

意思是说需要运行在服务器上，运行以下命令配置本地服务

npm install -g http-server // 该命令只需执行一次, 全局安装
复制代码

安装完毕后，更改congif/index.js文件中build下的assetsPublicPath属性值为"./"(默认为/)

好啦，双击index.html开启本地预览~

将config -> index.js 中的build下的productionSourceMap属性值设为false，打包后文件体积可以减少百分之八十

转载于:https://juejin.im/post/5c9354f55188252d7a5c520f