Nuxt not building due to upstream @babel/preset-env change

Versions

  • nuxt: 2.15.1
  • node: 15.0.1

Reproduction

Make a new project and try to build it.

Steps to reproduce

See above

What is Expected?

It should build and show the welcome page.

What is actually happening?

The build fails with the error log.

This is caused by upstream package @babel/preset-env. Starting from version 7.12.17 which is the current minimum version, the utils.js file no longer exists.

To fix this, Nuxt would either need to upgrade to support or lock the package version to 7.12.16. I’ve done this on my local package.

 ERROR  in ./.nuxt/client.js                                                                                                                                                                                                        friendly-errors 17:55:29

Module build failed (from ./node_modules/babel-loader/lib/index.js):                                                                                                                                                                friendly-errors 17:55:29
Error: /Users/tj/Development/my.springs/.nuxt/client.js: Cannot find module '@babel/preset-env/lib/utils'
Require stack:
- /Users/tj/Development/my.springs/node_modules/@nuxt/babel-preset-app/src/polyfills-plugin.js
- /Users/tj/Development/my.springs/node_modules/@nuxt/babel-preset-app/src/index.js
- /Users/tj/Development/my.springs/node_modules/@babel/core/lib/config/files/module-types.js
- /Users/tj/Development/my.springs/node_modules/@babel/core/lib/config/files/configuration.js
- /Users/tj/Development/my.springs/node_modules/@babel/core/lib/config/files/index.js
- /Users/tj/Development/my.springs/node_modules/@babel/core/lib/index.js
- /Users/tj/Development/my.springs/node_modules/babel-loader/lib/index.js
- /Users/tj/Development/my.springs/node_modules/loader-runner/lib/loadLoader.js
- /Users/tj/Development/my.springs/node_modules/loader-runner/lib/LoaderRunner.js
- /Users/tj/Development/my.springs/node_modules/webpack/lib/NormalModule.js
- /Users/tj/Development/my.springs/node_modules/webpack/lib/NormalModuleFactory.js
- /Users/tj/Development/my.springs/node_modules/webpack/lib/Compiler.js
- /Users/tj/Development/my.springs/node_modules/webpack/lib/webpack.js
- /Users/tj/Development/my.springs/node_modules/@nuxt/webpack/dist/webpack.js
- /Users/tj/Development/my.springs/node_modules/@nuxt/builder/dist/builder.js
- /Users/tj/Development/my.springs/index.js
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:900:15)
    at Function.Module._load (node:internal/modules/cjs/loader:745:27)
    at Module.require (node:internal/modules/cjs/loader:972:19)
    at n (/Users/tj/Development/my.springs/node_modules/jiti/dist/v8cache.js:2:2364)
    at PluginPass.Program (/Users/tj/Development/my.springs/node_modules/@nuxt/babel-preset-app/src/polyfills-plugin.js:15:34)
    at newFn (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/visitors.js:175:21)
    at NodePath._call (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/path/context.js:55:20)
    at NodePath.call (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/path/context.js:42:17)
    at NodePath.visit (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/path/context.js:92:31)
    at TraversalContext.visitQueue (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/context.js:116:16)
    at TraversalContext.visitSingle (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/context.js:85:19)
    at TraversalContext.visit (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/context.js:144:19)
    at Function.traverse.node (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/index.js:82:17)
    at traverse (/Users/tj/Development/my.springs/node_modules/@babel/traverse/lib/index.js:62:12)
    at transformFile (/Users/tj/Development/my.springs/node_modules/@babel/core/lib/transformation/index.js:107:29)
    at transformFile.next (<anonymous>)
                                                                                                                                                                                                                                    friendly-errors 17:55:29
 @ multi ./node_modules/eventsource-polyfill/dist/browserify-eventsource.js (webpack)-hot-middleware/client.js?reload=true&timeout=30000&ansiColors=&overlayStyles=&path=%%2F__webpack_hmr%%2Fclient&name=client ./.nuxt/client.js
                                                                                                                                                                                                                                    friendly-errors 17:55:29

7 thoughts on “Nuxt not building due to upstream @babel/preset-env change

  1. Workaround is to pin @babel/preset-env to version 7.12.17 in the yarn.lock file using resolutions.

    Doesn’t work either

    EDIT: My bad, I used @babel/core instead of @babel/preset-env. It works! Thanks

  2. @thederekkaplan , I found the answer here by hzoo.
    Basically have your dependencies look like this

    "dependencies": { "core-js": "^3.8.3", "nuxt": "^2.14.12", **"@babel/preset-env": "~7.12.0"** },

    it should do the trick.

  3. Worked from me:

    Add this on devDependencies:

    "@babel/preset-env": "7.12.17"
    

    or

    Workaround is to pin @babel/preset-env to version 7.12.17 in the yarn.lock file using resolutions.

    Install corejs@3

    yarn add --dev core-js@3 @babel/runtime-corejs3
    

    and update build.babel in nuxt.config.js

    babel: {
            presets() {
              return [
                [
                  '@nuxt/babel-preset-app',
                  {
                    corejs: {
                      version: 3,
                    },
                  },
                ],
              ];
            },
    
  4. Thanks for report. Issue is solved in 2.15.2 by pinning @babel-preset/env to ~7.12 until properly upgrading.


    If for any reason cannot upgrade to 2.15, you can use resolutions field in package.json (requires using yarnpkg):

      "resolutions": {
        "@babel/preset-env": "~7.12.17"
      }

    If using npm, should additionally use npm-force-resolutions

    "scripts": {
      "preinstall": "npx npm-force-resolutions"
    }