Webpack：使用 webpack.ignorePlugin 时出现 'Cannot find module' 问题

Question

在我的代码中，我有一个导入语句如下：

import '../theme/src/fonts/dist/_icons.scss'

我想知道的是，我不想在构建状态下导入这个文件，这意味着在构建阶段我想忽略这个语句。所以我使用webpack.ignoreplugin，我的设置如下：

...,
plugins: [
    ...,
    new webpack.IgnorePlugin(/^\.\.\/theme\/src\/fonts\/dist\/_icons\.scss/, /binder$/),
    ....
]

好吧，在我构建的文件中 icons.scss 没有导入，这意味着它被忽略了。但是当我打开构建的文件时出现以下错误：

throw new Error("Cannot find module \"../theme/src/fonts/dist/_icons.scss\"")

所以我使用 webpack.ignorePlugin 有什么问题吗？

Answer 1

你可以试试。

module.exports = {
  //...
  externals: /^\.\.\/theme\/src\/fonts\/dist\/_icons\.scss/
};

Answer 2

我生成一个空的 scss 文件，然后我使用一个别名，'../theme/src/fonts/dist/_icons.scss': emptyScssfilepath，所以构建将使用这个空的 scss 文件。

Answer 3

我有同样的问题，并发现这是 webpack 维护者的预期行为：https://github.com/webpack/webpack/issues/2858。你是对的，推荐的解决方案是使用别名。

Webpack: 'Cannot find module' issue when using webpack.ignorePlugin