无法将 babel 加载器应用于依赖项

Question

我的项目的一个依赖项是使用箭头函数，我似乎无法让 babel-loader 转译外部依赖项。

我的模块部分看起来像

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

我最初在规则对象中有 exclude: /node_modules/(?!superagent)/ ，但删除了它以确保它不是正则表达式问题。

.babelrc

{
  "presets": [
    "@babel/env",
    "@babel/react"
  ]
}

索引.js

import superagent from 'superagent'

superagent.get('http://www.google.com')
    .then(result=>console.log('done'))
    .catch(e=>console.error(e));

在这种情况下，有问题的依赖是 superagent

我用显示问题的配置创建了一个最小的 repo https://github.com/ksmith97/WebpackIssue

我不确定这里还有什么可以尝试的

编辑：要清楚这是为了 IE 11 支持。

Answer 1

将 babelrc 配置直接移动到 babel 加载器：

const path = require('path');

module.exports = {
    entry: './index.js',
    mode: 'development',
    devtool: 'source-map',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js'
    },
    module: {
        rules: [{
            test: /\.(jsx?)$/,
            use: {
                loader: 'babel-loader',
                options: {
                    presets: [
                        "@babel/preset-env",
                        "@babel/preset-react"
                    ]
                }
            },
        }]
    }
};

这个问题也让我感到惊讶，但查看文档你会看到：

一旦找到包含 package.json 的目录，搜索将停止，因此相对配置仅适用于单个包。

并且在包内的情况下，node_modules它们都会有自己的package.json文件，.babelrc当正在编译的文件在包内时，这将使项目根目录中的node_modules.

加载程序配置没有这个限制。