vue-cli打包后dist文件运行空白和背景图显示问题详解
1.文件引用路径。我们直接运行打包后的文件夹中的index.html文件,会看到网页一片空白,f12调试,全是css,js路径引用错误的问题。
解决:到config文件夹中打开index.js文件。
assetsPublicPath属性作用是指定编译发布的根目录,‘/’指的是项目的根目录 ,’./’指的是当前目录。
build: {
// Template for index.html
index: path.resolve(__dirname, '../dist/index.html'),
// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: './',
/**
* Source Maps
*/
2.
vue-cli构建的vue项目打包后css引入的背景图路径不对的问题
解决方法:只需要在build/utils.js文件中添加如下一行代码即可。 publicPath:'../../'
// Extract CSS when that option is specified
// (which is the case during production build)
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
publicPath:'../../',
})
} else {
return ['vue-style-loader'].concat(loaders)
}
}
更多参考 链接:https://www.cnblogs.com/aidixie/p/10102169.html
https://www.cnblogs.com/wanf/p/7871787.html
那时候我只有一台录音机也没有电脑 也不敢奢求说唱会让自己的生活变好