Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

如何为css文件中的url配置路径 #16

Open
luchanan opened this issue Nov 12, 2019 · 2 comments
Open

如何为css文件中的url配置路径 #16

luchanan opened this issue Nov 12, 2019 · 2 comments

Comments

@luchanan
Copy link

你好,请教一个问题,我使用vue inspect打出webpack的配置, 发现publicPath的路径都是根据上下文的得出来的()

/* config.module.rule('scss').oneOf('normal') */
          {
            use: [
              /* config.module.rule('scss').oneOf('normal').use('extract-css-loader') */
              {
                loader: 'E:\\project\\test\\node_modules\\mini-css-extract-plugin\\dist\\loader.js',
                options: {
                  hmr: false,
                  publicPath: '../../../../../'
                }
              },

然后对应的资源文件在css的url是这样的url(../../../../staic/img/[name].[hash:8].[ext])

/* config.module.rule('svg') */
      {
        test: /\.(svg)(\?.*)?$/,
        use: [
          /* config.module.rule('svg').use('file-loader') */
          {
            loader: 'file-loader',
            options: {
              name: 'static/img/[name].[hash:8].[ext]'
            }
          }
        ]
      },

请问有什么办法配置publicPath,使得css文件中的font,img等url采用的是(还有webpack的scss中的publicPath)

url(../img/aaa.png)

我试了一下与vue.config.js中的publicPath无关, 但是和assetsDir有关,我知道chain可以分别设置img,font的publicPatch

config
      .module
      .rule("images")
      .test(/\.(png|jpe?g|gif|svg)(\?.*)?$/)
      .use("url-loader")
      .loader("url-loader")
      .options({
        limit: 5 * 1024, // 10k,
        publicPath: process.env.NODE_ENV === 'production' ? '../' : undefined,
        outputPath: getAssetPath(buildConfig.assetsDir(), 'img'),
        name: 'img/[name].[hash:7].[ext]',
      })

有没有全局的可以设置publicPath呢?thanks

@mdxiaohu
Copy link

@luchanan 你这个问题解决么

@zuolg
Copy link

zuolg commented Sep 20, 2023 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants