geektime-webpack-course icon indicating copy to clipboard operation
geektime-webpack-course copied to clipboard

关于正则匹配规则的代码缺陷问题

Open ChangerHe opened this issue 5 years ago • 0 comments

{
        test: /.css$/,
        use: [
          MiniCssExtractPlugin.loader,
          'css-loader',
        ],
      },

如老师以上代码, 当我想要加上sass的支持的时候, 我马上增加了如下匹配规则

{
        test: /.s[ac]ss$/,
        use: [
          MiniCssExtractPlugin.loader,
          'css-loader',
          'sass-loader'
        ]
      },

但是在编译过程中, 发现scss后缀的文件会被匹配到css的规则上, 导致产生两次编译而报错, 错误如下

Didn't get a result from child compiler

debug了一下发现, 是因为两次匹配导致css的规则匹配错误, 导致编译产物为空造成的

因此建议修改一下/.css$//\.css$/, 如果需要使用sass, 则使用 /\.s[ac]ss$/,作为匹配规则, 避免正则下.未转义产生的问题

以上

ChangerHe avatar Oct 10 '20 03:10 ChangerHe