vue打包配置

vue打包配置
1.资源相对引用路径
2.背景图片的引用问题
3.index.html页面没有显示内容
4.页面空白
5.样式混乱
6.降低打包文件大小
关闭 productionSourceMap

TOC

vue打包配置

1.资源相对引用路径

• build/webpack.prod.conf.js

找到output：增加 publicPath: './', 

2.背景图片的引用问题

• build/utils.js

找到if (options.extract) {
添加一行  publicPath:'../../'

3.index.html页面没有显示内容

• config/index.js

更改config/index.js 中的参数:
    assetsPublicPath:'./',

4.页面空白

• router/index.js

将mode: 'history', /*使用HTML格式*/
注释掉(history需要另外配置才可以使用)

5.样式混乱

通用的css文件在main.js中统一引用,且放到最前面(不要在多个文件中引用,局部的在局部页面中引用即可)

6.降低打包文件大小

关闭 productionSourceMap

\config\index.js的module.exports中build的productionSourceMap设置为false,打包的时候就不会生成map文件,打包速度也会提升很多;

来自为知笔记(Wiz)