Nuxt.js: corejs option in @nuxt/babel-preset-app

[shrpne]

What problem does this feature solve?

Can you please expose corejs option in the @nuxt/babel-preset-app so it will be passed to the @babel/preset-env as other options?

_{This feature request is available on Nuxt community (#c8902)}

[manniL]

cc @clarkdo, @pi0

[clarkdo]

Will work on it

[clarkdo]

After talk to team, this feature may need more discussion and find a proper way to solve the root issue.

core-js 2 and 3 are not compatible and having totally different dir structure, so if a project contains both 2 and 3, user may have files in specific core-js version cannot be found issue in building or starting phase.

Benefits

1. An option to let users (who know exactly which version of core-js they should use and is installed in node_modules of their projects) fix core-js issue.

Disadvantages

1. Adding option and documenting it may cause community being more confused about core-js issue and facing more problems
2. For supporting core-js 2 or 3 will need different dependencies like core-js@2/3, core-js-compat, but dynamically choosing dependencies is hard in node.js since packages hoisting

[clarkdo]

/cc @pi0

[posva]

What do we do if we have @babel/preset-env installed for testing purposes, which includes core-js@3 and we end up with both versions?

yarn why v1.15.2
[1/4] 🤔  Why do we have the module "core-js"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "[email protected]"
info Reasons this module exists
   - "@babel#preset-env#core-js-compat" depends on it
   - Hoisted from "@babel#preset-env#core-js-compat#core-js"
info Number of shared dependencies: 0
=> Found "babel-runtime#[email protected]"
info This module exists because "vue-jest#babel-plugin-transform-es2015-modules-commonjs#babel-runtime" depends on it.
info Number of shared dependencies: 0
=> Found "@nuxt/babel-preset-app#[email protected]"
info This module exists because "nuxt#@nuxt#webpack#@nuxt#babel-preset-app" depends on it.
info Number of shared dependencies: 0
✨  Done in 1.47s.

[pi0]

@posva True :( We are in the middle of a breaking change by babel. Some 3rd party packages still depending on corejs@2 and some on corejs@3 and can't have both on a same project. So decided to make @3 opt-in and suggesting users that facing the problem to manually install one version in their package.json

[posva]

That has to be hard for you to handle, I'm sorry
For the moment installing core-js@3 seems to show the same problem. Maybe I need to downgrade nuxt or @babel/preset-env until @3 is an optin?

[pi0]

@posva See _core-js@3_ section of release notes

[posva]

Thanks! It's weird, because I removed core-js from the package.json, removed node_modules and yarn.lock, reinstalled, and things work again

[clarkdo]

@posva It's probably because package hoisting due to yarn.lock.

The new generated yarn.lock may be more flat than old one, so the core-js in node_modules is expected version after re-install.

[posva]

It indeed changed to 2 different versions of core-js instead of 3 but there was still core-js@3 and core-js@2. The one hoisted is the v2 now 👍

yarn why v1.15.2
[1/4] 🤔  Why do we have the module "core-js"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] 🔍  Finding dependency...
[4/4] 🚡  Calculating file sizes...
=> Found "[email protected]"
info Has been hoisted to "core-js"
info Reasons this module exists
   - Hoisted from "vue-jest#babel-plugin-transform-es2015-modules-commonjs#babel-runtime#core-js"
   - Hoisted from "nuxt#@nuxt#webpack#@nuxt#babel-preset-app#core-js"
info Number of shared dependencies: 0
=> Found "core-js-compat#[email protected]"
info This module exists because "@babel#preset-env#core-js-compat" depends on it.
info Number of shared dependencies: 0

[clarkdo]

core-js@2 is hoisted to the root node_modules due to more packages are using it.
core-js@3 is in node_modules/@babel/preset-env/node_modules/core-js-compat/node_modules

So the require('core-js') will get core-js@2 for all packages except core-js-compat

[clarkdo]

Has been release in v2.6.0