如何使用babel-loader转换node_modules模块？

Question

问题：我想为较旧的浏览器（> = IE10）构建网站的捆绑文件。

我transpiled代码抛出旧的Internet Explorer 11的错误，当我transpile的代码babel 7.x使用babel-loader，因为它似乎node_modules模块将不会默认了transpiled？

问题：如果我的所有node_module模块都尚未被软件包作者转译，我如何确保所有模块都会被转译？

使用babel-loader的webpack.config.js

// webpack.config.js
rules: [
    {
        test: /\.(js|jsx)$/,
        use: [
            {
                loader: 'babel-loader',
            },
        ],
        exclude: [],
    },
],

使用babel 7.x的babelrc.js配置

// .babelrc.js
module.exports = function(api) {
    const presets = [
        [
            '@babel/preset-env',
            {
                useBuiltIns: 'usage',
                ignoreBrowserslistConfig: true,
                targets: {
                    node: 8,
                    browsers: [
                        'last 3 versions',
                        '> 1% in DE',
                        'Explorer >= 10',
                    ],
                },
            },
        ],
        '@babel/preset-react',
    ];

    const plugins = [
        // ...
    ];

    return {
        presets,
        plugins,
    };
};

---

更新1：

通天塔是个问题。我的babel配置已命名，.babel.rc而babel 7的默认设置是查找名为的配置文件babel.config.js，请参见此处。

所以从'.babel.rc'重命名巴贝尔配置文件后'babel.config.js'我可以申请描述了我'webpack.config.js'的解决方案在这里有一个这样的解决方案，改造未转化'node_modules'包：

// webpack.config.js
rules: [
    {
        test: /\.(js|jsx)$/,
        use: [
            {
                loader: 'babel-loader',
            },
        ],
        // Exclude the untransformed packages from the exclude rule here
        exclude: /node_modules\/(?!(MY_MODULE|ANOTHER-ONE)\/).*/, 
    },
],

问题：感觉是一种解决方法，但是没有更便捷的方法来处理此类问题吗？我只是假装在不久的将来外面会有越来越多的未转换的软件包（在此讨论之后），我们是否总是必须手动将其软件包名称放入webpacks的exclude规则中？

Answer 1

问： 感觉像是解决方法，但是有没有更方便的方法来处理此类问题？我只是假装在不久的将来会有越来越多未转换的包（在本次讨论之后），我们是否总是需要手动将其包名称放入 webpack 的排除规则中？

您可以使用模块are-you-es5自动创建例外列表或测试：https://www.npmjs.com/package/are-you-es5

eslint-plugin-compat如果指向您的node_modules： https: //www.npmjs.com/package/eslint-plugin-compat，类似的事情也可能会警告您出现问题

但它并不完美。我认为在一般的生产设置中，您应该在添加软件包之前了解您添加的软件包，或者进行一些自动化测试，以便在 IE11 对您的项目至关重要的情况下捕获浏览器错误。

我知道这并不总是可能的，但我强烈建议将 IE11 及更低版本推向一些较低层的支持。在使用现代 JS 的同时，仍然维持 IE11 及以下版本是非常困难的。