Babel插件/预设文件不允许导出对象，只能导出函数。

Question

Babel插件/预设文件不允许导出对象，只能导出函数。

javascriptwebpackbabeljs

59

我正在尝试在一个旧项目中使用 Babel-loader，但我注意到在处理包装对象时存在一些问题，这是它的默认行为吗？我不确定这是否是一个 bug 或者我做错了什么，我在谷歌上没能找到太多相关信息，所以这是我的最后一个资源。

我需要更改代码才能使其工作吗？

这是我的当前规格：

Webpack: 3.19.0
babel/core: 7.0.0-beta.34
babel-loader: 8.0.0-beta.0

如有需要，请参考我的 packages.json：

http://paste.ubuntu.com/26187880/

我正在尝试加载一个被函数包装的单个文件：

http://paste.ubuntu.com/26187814/

总之，这是一些旧的东西，像这样构建：

(  window.global = { } )();

这是我的webpack配置：

const webpackConfig = {
    context: __dirname,
    entry: {
        app: '../../JavaScript/Namespacing.js'
    },
    module: {
        rules: [
          {
            test: /.jsx?$/,
            exclude: /(node_modules|bower_components)/,
            use: {
              loader: 'babel-loader',
            }
          }
        ]
    },
    output: {
      path: __dirname + "/../../static/js",
      filename: "[name].js"
    },
    plugins: [
        new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery",
            "window.jQuery": "jquery"
        })
    ],
}

我在我的文件中遇到了以下错误：

插件/预设文件不允许输出对象，只能输出函数。

那么，我是不是缺少什么？

感谢任何帮助。

- Gabriel Slomka

1

我能看一下你的.babelrc文件吗？ - IzumiSy

1

@Gabriel Slomka，您的问题是否已通过下面给出的答案得到解决？ - Jimit Patel

6个回答

11

从你的 package.json 中可以看出，你正在使用旧版的插件和预设，这些是针对 Babel v6 的，会导致此错误。你需要切换到比如 @babel/preset-env，然后相应地更新你的 .babelrc 文件（如果你提供了 .babelrc 文件，则可以给出更具体的指导）。

这里有一个相关的问题及其解释 - https://github.com/babel/babel-loader/issues/540

我在 package.json 中还看到一些半相关的注释：

旧版的 babel-core 依赖项仍然存在。删除它或将其更新到版本 7.0.0-bridge.0。同样地，旧版的 react 预设也在其中，请将其删除。

如果您正在使用 env 预设，则根本不需要使用 es2015 预设。请将其删除。

- Spain Train

6

Babel将其软件包移至其Scope Repository，自7.x版本起。

Babel软件包在主npmjs上的最新版本为：

"babel-core": "^6.26.3",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
...

但是您必须在 @babel/ 作用域存储库中使用 The Continued 版本：

截至今天，它们是：

"@babel/core": "^7.12.16",
"@babel/preset-env": "^7.12.16",
"@babel/preset-react": "^7.12.13",
...

所以你需要卸载并重新安装它们：

npm uninstall babel-core babel-preset-env babel-preset-react
npm install @babel/core @babel/preset-env @babel/preset-react

或：

yarn remove babel-core babel-preset-env babel-preset-react --dev
yarn add @babel/core @babel/preset-env @babel/preset-react --dev

注意1：您可以添加一个@并将第一个-更改为/ 注意2：请注意，babel-loader包不在babel软件包中，它是用于加载babel的webpack模块。(最新版本仍然是babel-loader)

更改babel的范围后，您必须对.babelrc进行所需的更改：

从：

"presets" : ["env","react"]

收件人：

"presets" : ["@babel/preset-env","@babel/preset-react"]

- Abilogos

1

大多数软件包甚至没有安装。所以，这是真正起作用的组合。在测试之前记得删除你的node_modules，并且更改.babelrc很重要。从package.json和.babelrc更新了devDependencies。 更新自：

1. Package.json file:

"devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "webpack": "^4.41.2",
}


2. .babelrc file:

{
   "presets": [
      "env",
      "react",
      "es2015"
  ],
  "plugins": [
    "transform-class-properties",
    "transform-object-rest-spread",
    "transform-react-jsx"
  ]
}

更新为：

1. Package.json file:

"devDependencies": {
      "@babel/core": "^7.13.10",
      "@babel/plugin-proposal-class-properties": "^7.8.3",
      "@babel/preset-env": "^7.1.6",
      "@babel/preset-react": "^7.0.0",
      "babel-cli": "^6.26.0",
      "babel-core": "^7.0.0-bridge.0",
      "babel-loader": "^8.0.4",
      "webpack": "^4.46.0"
}


2. .babelrc file:

{
  "presets": ["@babel/preset-env", "@babel/react"],
  "plugins": [
    "transform-class-properties",
    "transform-object-rest-spread",
    "transform-react-jsx"
  ]
}

- KushalSeth

1

答案适用于旧版本。目前这个设置已经足够了：

  "presets": ["@babel/preset-env", "@babel/preset-react"],

如果您在这些包的基础上使用了“babel-preset-stage-0”软件包，您仍将遇到相同的错误。因此，请卸载“babel-preset-stage-0”，并确保除“babel-loader”之外的所有babel软件包都以“@babel”开头。 “@babel”表示该软件包由Babel团队维护。

- Yilmaz

0

这个方法对我有效：

npm uninstall --save babel-loader

npm uninstall --save @babel/core

npm install --save-dev babel-loader@^7

并且在 babelrc 中添加：

"presets" : ["env", "react"]

- Chiraag Mittal

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Prince Francis · Accepted Answer

我使用babel 7.x和"babel-loader": "^8.0.4"时遇到了相同的错误。

我通过更改package.json中以下依赖项来解决了这个问题。我从这些链接中找到了解决方案。

"devDependencies": {
    "@babel/core": "^7.1.6",
    "@babel/preset-env": "^7.1.6",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "^8.0.4",
    "webpack": "^4.25.1",
    "webpack-cli": "^3.1.2"
}

并在.babelrc中

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

或在 package.json 文件中

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

如果您正在使用npm，则请使用以下内容

npm install @babel/core --save-dev
npm install @babel/preset-env --save-dev
npm install @babel/preset-react --save-dev
npm install babel-loader --save-dev
npm install webpack --save-dev
npm install webpack-cli --save-dev

如果您正在使用yarn，则使用以下命令：

yarn add @babel/core --dev
yarn add @babel/preset-env --dev
yarn add @babel/preset-react --dev
yarn add babel-loader --dev
yarn add webpack --dev
yarn add webpack-cli --dev