解决vue打包之后 打开直接使用浏览器打开index.html出现空白页
1.打包之前修改三个文件
1.1.第一步,找到build文件,在webpack.prod.conf.js 第25行左右 有一个对象为 output,在这里面增加一行代码
output: {
//在这里加一行代码
publicPath:'./',
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
1.2.第二步,找到utils.js,在 第47行左右 有一个if判断为 if (options.extract),在这里面增加一行代码
注意:这个是保证 加载背景图片等css样式资源不出现 路径问题
if (options.extract) {
return ExtractTextPlugin.extract({
publicPath:'../../', //在这里加一行代码
use: loaders,
fallback: 'vue-style-loader'
})
}
1.3.第三步,找到config/index.js第46行左右 修改assetsPublicPath 路径为 './';如果修改之后打包能直接访问,但是开启服务又出现Cannot GET /
就改回'/'
2.然后你就可以 build 了,之后你就可以直接在浏览器打开了,也能直接挂载在git上面。
本文作者:大海&
本文链接:https://www.cnblogs.com/oceanus/p/14591947.html
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。