1

为了将我的 css 文件输出mini-css-extract-plugin到一个目录，我执行了以下操作：

  context: path.resolve(__dirname, "src"),
  entry: {
    "main": "./js/index.js"
  },
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'js/[name].[contenthash].js',
  },
  module: {
    rules: [
      {
        test: /\.(png|jpg)/,
        use: [
          {
            loader: "file-loader",
            options: {
              name: "images/[hash].[ext]"
            }
          },
        ]
      },
      {
        test: /\.css$/,
        use: ['MiniCss.loader', 'css-loader', 'postcss-loader']
      },
  plugins: [
    new MiniCss({
      filename: '[name].[hash].css',
    })
  ]
}

在css中我有类似的东西： background: url(img/fold.svg) right 30% / 100% no-repeat;

现在的问题是所有图像都是从而css/dist不是dist. publicPath: '../'我可以通过设置 a on来解决问题MiniCss.loader，但是所有图像都被引用，.././images这些图像通过相对路径起作用，但看起来并不“自然”。现在我的问题是有一种更清洁的方法来实现这一目标吗？

4

0 回答 0