标签: vue-cli-5

vuejs:vue-cli 5 webpack 无法解析 css 中的 url()

我将图像放在公共目录(其中包含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 时它可以工作。

webpack vue-cli webpack-5 vue-cli-5

6
推荐指数
0
解决办法
303
查看次数

如何更改规则内的文件名?(Vue CLI 5)

我有这个规则,使用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 的文件名?

webpack vue.js vue-cli vue-cli-5

3
推荐指数
1
解决办法
1235
查看次数

标签 统计

vue-cli ×2

vue-cli-5 ×2

webpack ×2

vue.js ×1

webpack-5 ×1