Question

我想通过postcss-loader在我的vue.config.js中添加chainWebpack的标准配置。但是我不知道如何将默认的webpack配置代码转换为链接的变体。

这是postcss-loader的建议默认设置：

module.exports = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          'style-loader',
          { loader: 'css-loader', options: { importLoaders: 1 } },
          'postcss-loader'
        ]
      }
    ]
  }
}

到目前为止，这是我在vue.config.js中尝试过的操作：

chainWebpack: config => {

  config.module
    .rule('postcss')
    .test(/\.css$/)
    .use('postcss-loader')
    .tap(options => {
      options.importLoaders = 1;

      return options;
    });
},

但这只是失败了：TypeError: Cannot set property 'importLoaders' of undefined

说实话，我不知道我到底在做什么。

更新：以下代码似乎可以正常工作-但目前无法确认，因为我遇到了可能相关或可能无关的错误

config.module
  .rule('postcss')
  .test(/\.css$/)
  .use('postcss-loader')
  .tap(options =>
    _merge(options, {
      importLoaders: 1,
    }),
  )
  .loader('css-loader');

（_ merge是来自merge的{{1}}）

通过vue.config.js中的chainWebpack的postcss-loader

0 个答案: