Nuxt js - Fresh install of nuxt 2.14.6 contains babel "loose option" warnings

user_13041485 0
Viewed 12650

I have a fresh install of nuxt version 2.14.6 and I would like to silence an error I get when I run the nuxt command:

 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.

I'm assuming I need to override the babel config in my nuxt.config.js file, but I haven't found any helpful solutions.

babeljs nuxt.js
5 Answers

Add the following to your nuxt.config.js file under the build section.

nuxt.config.js

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

Try add these in 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 }]
    ]
  }  
},
user_136537360

I'd rather reset nuxt back to 2.15.2 and wait until it's fixed. While the above answer fixes it in the short run, those warnings on a fresh nuxt install look like a bug to me.

user_137046130

More recent update for Nuxt 2.15.7

It looks like some errors are back again with the latest release, more info can be found here Latest Nuxt v2.15.7 install with babel "loose" option warnings

This ons is fixed from Nuxt v2.15.5 as stated in this github issue: https://github.com/nuxt/nuxt.js/issues/9224#issuecomment-835742221

You can remove any resolutions and build.babel.plugins related to this bug in your nuxt.config.js configuration. Also, if needed you should reset:

  • yarn.lock (or package-lock.json)
  • node_modules/.cache
  • .nuxt
user_88165850

package.json (When my packages were as under)

"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 (Following helped me)

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