我将图像放在公共目录(其中包含index.html)中,然后使用 url() 制作背景,如下所示:
.login-container {
background-image: url('/static/image1.png'),url('/static/image2.png');
}
Run Code Online (Sandbox Code Playgroud)
但 vue-cli5 说
Can't resolve '/static/images/login_bg.jpg' in '...\views\login'
我该如何解决这个问题?当我使用 vue-cli 4 时它可以工作。
我有这个规则,使用vue inspect
/* config.module.rule('svg') */
{
test: /\.(svg)(\?.*)?$/,
type: 'asset/resource',
generator: {
filename: 'img/[name][ext]'
}
},
Run Code Online (Sandbox Code Playgroud)
我需要将文件名更改为“[contenthash][ext]”,但我无法使用
module.exports = defineConfig({
chainWebpack: (config) => {
config.module.rule("svg").generator.filename = "[contenthash][ext]";
},
})
Run Code Online (Sandbox Code Playgroud)
因为我无法设置发电机,
我可以使用重写所有规则
module.exports = defineConfig({
configureWebpack: (config) => {
config.module.rules = [
{
test: /\.(svg)(\?.*)?$/,
use: [
{
loader: "svg-inline-loader",
options: {
name: "[contenthash].[ext]",
},
},
],
},
];
},
})
Run Code Online (Sandbox Code Playgroud)
但我需要存在其他规则...那么如何更改 svg 的文件名?