如何在webpack中使用babel-loader选择性地处理node_modules中的代码？

Question

这是这个答案的后续行动。

我有一些第三方代码（反应组件），我捆绑为ES模块（使用pkg.module入口点）。 这很好用（你得到模块连接和树摇动），但是包含的代码没有用babel编译，因为在大多数配置示例之后，我在webpack配置的babel-loader部分中排除了node_modules ，如下所示：

{
    ...
    module: {
        rules: [
            {
                exclude: /(node_modules)/,
                use: {
                    loader: 'babel-loader',
                    ...
                }
            }
        ]
    },
    ...
}

因此，当我运行webpack时，我得到意外的令牌错误。 基于链接的答案，我从使用exclude切换到include可选地从node_modules引入一些包，如下所示：

{
    ...
    module: {
        rules: [
            {
                include: [/node_modules\/@my-scope/, /src/],
                use: {
                    loader: 'babel-loader',
                    ...
                }
            }
        ]
    },
    ...
}

这对我来说似乎有用（当我运行webpack时不会出现意外的令牌错误），但我并不是100％确定它正在按照我的想法行事。

这个解决方案看起来不对吗 有没有更好的办法？

Answer 1

解决方案对我来说没问题。 如果包含开始变得复杂，您可以用函数替换它并使用逻辑在那里进行过滤。