Question

我有一个基于vue.js Webpack模板的应用程序。我需要使用专用字段和类的专用方法的语法。为此，我安装了@ babel / plugin-proposal-private-methods ^ 7.4.4和@ babel / core ^ 7.0.0。安装软件包后，我尝试构建开发版本，但是出现以下错误。

Webpack版本是^ 3.6.0，vue ^ 2.6.10，babel-core ^ 6.22.1，babel-preset-env ^ 1.3.2。


    ERROR in ./assets/main.js
    Module build failed: Error: Requires Babel "^7.0.0-0", but was loaded with "6.26.3". If you are sure you have a compatible version of @babel/core, it is likely that something in your build process is loading the wrong version. Inspect the stack trace of this error to look for the first entry that doesn't mention "@babel/core" or "babel-core" to see what is calling Babel.

Answer 1

您似乎正在使用babel 6加载@ babel / core @ 7.X.X。

换句话说，您正在使用babel 6的api调用babel 7的核心编译器。

发布babel 7，babel团队进行了重大改造，虽然很棒，但不兼容复古。

您的模板可能与babel 6兼容，您需要一些babel 7插件。因此，总结一下，您将必须：

升级所有babel依赖项（cli，core，插件，预设...）
更新您的babel配置
替换不推荐使用的
可能升级您的webpack babel加载程序或至少修复webpack conf

我强烈建议您阅读官方升级文档： https://babeljs.io/docs/en/v7-migration 您可能还需要升级Webpack。

欢呼

Answer 2

将以下内容添加到 build 部分下的 nuxt.config.js 文件中。

build: {
  babel:{
    plugins: [
      ['@babel/plugin-proposal-private-methods', { loose: true }]
    ]
  }
}

如何使@ babel / plugin-proposal-private-methods在vue.js Webpack模板中工作？

2 个答案: