problem description
1. The project path is as follows
Picture description
reset.scss
.footer {
background: url ("/ static/img/top.png") no-repeat;
}
3.npm run build
Image path error. Changing to. / static before / static in debug mode can load the image
if reset.scss footer is changed to. / static/img/top.png webpack error message This relative module was not found
it seems that absolute path can only be used here
Picture description
related codes
1.buid/utils.js
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: "vue-style-loader",
publicPath: "../../",
})
}
sass
scss: generateLoaders("sass").concat(
{
loader: "sass-resources-loader",
options: {
resources: path.resolve(__dirname, "../static/sass/main.scss")
}
}
2.config/index.js
build: {
// Template for index.html
index: path.resolve(__dirname, "../dist/index.html"),
// Paths
assetsRoot: path.resolve(__dirname, "../dist"),
assetsSubDirectory: "static",
assetsPublicPath: "./",
}