webpack - 让 babel-loader 通过 webpack

Question

我有一个 lerna monorepo，有两个包：marketing-site 和 button。我的营销站点包使用 webpack 配置，具有以下规则：

{
  test: /\.scss$/,
  use: [
    {
      loader: 'css-loader',
      options: {
        modules: true,
      },
    },
    'sass-loader',
  ],
},
{
  test: /\.jsx?$/,
  include: [ // the include key does not seem to make a difference
    path.join(__dirname, '..'),
  ],
  use: 'babel-loader'
},

如果我在marketing-site/src/index.js，并且我import styles from '../button/src/styles.scss'，它会起作用。scss 由sass-loader和 处理css-loader。

但是，如果 Iimport '../button/src'本身具有import './style.scss'，我会得到一个SyntaxError: Unexpected token.

同样，如果我将整个按钮文件夹移动到marketing-site中，一切正常。

有什么方法可以强制 webpack 使用它的加载器来处理根目录之外的另一个目录中的 scss 文件？

（不幸的是，我需要指定要在这个 webpack 配置中使用的加载器，因为在同一个 monorepo 中有另一个项目使用不同的加载器集。我们希望button在两者之间共享这个组件。因此，在button/.babelrc是不够的。）

Answer 1

看起来答案是有一个错误externals: [ someFunction ]将这个 scss 导入错误地标记为外部。