Nuxt js - 全新安装的 nuxt 2.14.6 包含 babel“宽松选项”警告答案

【问题标题】：Nuxt js - Fresh install of nuxt 2.14.6 contains babel "loose option" warningsNuxt js - 全新安装的 nuxt 2.14.6 包含 babel“宽松选项”警告
【发布时间】：2021-07-24 18:27:19
【问题描述】：

我全新安装了 nuxt 版本 2.14.6，我想消除运行 nuxt 命令时出现的错误：

 WARN  Though the "loose" option was set to "false" in your @babel/preset-env co
The "loose" option must be the same for @babel/plugin-proposal-class-properties,
        ["@babel/plugin-proposal-private-methods", { "loose": true }]
to the "plugins" section of your Babel config.

我假设我需要覆盖我的 nuxt.config.js 文件中的 babel 配置，但我没有找到任何有用的解决方案。

【问题讨论】：

标签： babeljs nuxt.js

【解决方案1】：

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

nuxt.config.js

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

【讨论】：

请随时在此处查看我的答案：stackoverflow.com/questions/68663581/… 或在此问题中：stackoverflow.com/a/67466363/8816585 @Anthony

【解决方案2】：

尝试在 nuxt.config.js 中添加这些：

build: {
  babel:{
    plugins: [
      ["@babel/plugin-proposal-class-properties", { "loose": true }],
      ["@babel/plugin-proposal-private-methods", { "loose": true }],
      ["@babel/plugin-proposal-private-property-in-object", { "loose": true }]
    ]
  }  
},

【讨论】：

@babel/plugin-proposal-private-property-in-object 就够了，没必要全部都有。

【解决方案3】：

我宁愿将nuxt 重置回2.15.2 并等待它修复。虽然上述答案在短期内修复了它，但新安装 nuxt 的那些警告对我来说似乎是一个错误。

【讨论】：

赞成。在没有完全理解后果的情况下，确保你没有沉默你可能真正关心的东西总是好的。不要介意我现在将它添加到我的 Babel 配置中...：D
Np，只是想为了完整性和其他人添加。
这没有提供问题的答案。一旦你有足够的reputation，你就可以comment on any post。 - From Review
为什么？当前行为是一个错误（全新安装时的警告），在修复版本可用之前，它是一个解决方案。
这只是模组的电源跳闸，按照 SO 上的惯例。坦率地说，这个答案对我来说至关重要

【解决方案4】：

Nuxt 2.15.7 的最新更新

最新版本似乎又出现了一些错误，更多信息可以在这里找到Latest Nuxt v2.15.7 install with babel "loose" option warnings

此问题已从 Nuxt v2.15.5 修复，如此 github 问题所述：https://github.com/nuxt/nuxt.js/issues/9224#issuecomment-835742221

您可以在您的nuxt.config.js 配置中删除与此错误相关的任何resolutions 和build.babel.plugins。此外，如果需要，您应该重置：

yarn.lock（或package-lock.json）
node_modules/.cache
.nuxt

【讨论】：

【解决方案5】：

package.json（当我的包如下时）

"dependencies": {
  "@nuxtjs/axios": "^5.13.6",
  "core-js": "^3.15.1",
  "nuxt": "^2.15.7",
  "vuetify": "^2.5.5"
},
"devDependencies": {
  "@nuxtjs/vuetify": "^1.12.1"
}

nuxt.config.js（以下帮助了我）

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

【讨论】：

如果nuxt 版本介于2.15.5 和2.15.7 之间，就会发生这种情况。
nuxt: 2.15.7的有效答案