Paypal api - Nuxt.js Cannot find module '@babel/preset-env/lib/utils'

JacobHyde
February 23, 2021
216 views
3 votes
9 Answers

I’m getting this error when trying to run yarn run dev --port=4000

Here is the error:

Module build failed (from ./node_modules/babel-loader/lib/index.js):                                                                                                                                                                friendly-errors 16:52:26
Error: /Users/jacob/code/artistrepublik/elite-reviews/.nuxt/client.js: Cannot find module '@babel/preset-env/lib/utils'
Require stack:
- /Users/jacob/code/artistrepublik/elite-reviews/node_modules/@nuxt/babel-preset-app/src/polyfills-plugin.js
- /Users/jacob/code/artistrepublik/elite-reviews/node_modules/@nuxt/babel-preset-app/src/index.js
- /Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/core/lib/config/files/module-types.js
- /Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/core/lib/config/files/configuration.js
- /Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/core/lib/config/files/index.js
- /Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/core/lib/index.js
- /Users/jacob/code/artistrepublik/elite-reviews/node_modules/nuxt-route-meta/dist/index.js
- /Users/jacob/code/artistrepublik/elite-reviews/node_modules/@nuxt/core/dist/core.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:965:15)
    at Function.Module._load (internal/modules/cjs/loader.js:841:27)
    at Module.require (internal/modules/cjs/loader.js:1025:19)
    at n (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/jiti/dist/v8cache.js:2:2364)
    at PluginPass.Program (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@nuxt/babel-preset-app/src/polyfills-plugin.js:15:34)
    at newFn (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/visitors.js:175:21)
    at NodePath._call (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/path/context.js:55:20)
    at NodePath.call (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/path/context.js:42:17)
    at NodePath.visit (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/path/context.js:92:31)
    at TraversalContext.visitQueue (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/context.js:116:16)
    at TraversalContext.visitSingle (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/context.js:85:19)
    at TraversalContext.visit (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/context.js:144:19)
    at Function.traverse.node (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/index.js:82:17)
    at traverse (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/traverse/lib/index.js:62:12)
    at transformFile (/Users/jacob/code/artistrepublik/elite-reviews/node_modules/@babel/core/lib/transformation/index.js:107:29)
    at transformFile.next (<anonymous>)
                                                                                                                                                                                                                                    friendly-errors 16:52:26
 @ 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

Here is my package.json:

{
  "name": "my-project",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "dev": "nuxt -r dotenv/config",
    "build": "nuxt build",
    "start": "nuxt start",
    "generate": "nuxt generate",
    "test": "jest"
  },
  "dependencies": {
    "@nuxtjs/axios": "^5.12.5",
    "@nuxtjs/dotenv": "^1.4.1",
    "@nuxtjs/pwa": "^3.3.4",
    "@paypal/paypal-js": "^1.0.5",
    "@vue/babel-preset-app": "^4.5.10",
    "core-js": "^3.8.3",
    "es6-promise": "^4.1.1",
    "lodash": "^4.17.20",
    "moment": "latest",
    "moment-timezone": "^0.5.32",
    "noty": "^3.2.0-beta",
    "nuxt": "^2.14.12",
    "nuxt-i18n": "^6.18.0",
    "nuxt-route-meta": "^1.0.3",
    "nuxt": "^2.14.6",
    "nuxt-i18n": "^6.15.1",
    "nuxt-route-meta": "^1.0.1",
    "nuxt-stripe-module": "^3.0.1",
    "object-to-formdata": "^4.1.0",
    "pluralize": "latest",
    "vee-validate": "^3.4.5",
    "sib-api-v3-sdk": "github:sendinblue/APIv3-nodejs-library",
    "vue-carousel": "^0.18.0",
    "vue-chartist": "^2.2.1",
    "vue-material-design-icons": "^4.11.0",
    "vuejs-noty": "^0.1.3",
    "vue-plyr": "^7.0.0",
    "vuetify-media-player": "^0.8.1"
  },
  "devDependencies": {
    "@babel/core": "^7.12.10",
    "@mdi/font": "^5.9.55",
    "@nuxt/types": "^2.14.12",
    "@nuxtjs/style-resources": "^1.0.0",
    "@nuxtjs/vuetify": "^1.11.3",
    "@vue/test-utils": "^1.1.2",
    "babel-jest": "^26.6.3",
    "babel-plugin-component": "^1.1.0",
    "cross-env": "^5.2.0",
    "dotenv": "^8.2.0",
    "jest": "^26.6.3",
    "material-design-icons-iconfont": "^6.1.0",
    "node-sass": "^4.14.1",
    "nodemon": "^1.18.9",
    "sass-loader": "^7.3.1",
    "vue-jest": "^3.0.4"
  }
}

And here is my .babelrc:

{
  "env": {
    "test": {
      "presets": [
        [
          "@babel/preset-env",
          {
            "targets": {
              "node": "current"
            }
          }
        ]
      ]
    }
  }
}

I have tried deleting the node_modules folder along with removing the yarn.lock file with no luck. The babel version looks correct. This error only popped up after me playing around with some code (not the package.json) – which is an unrelated error.

Any help would be appreciated!

Answers

- Shirker
- February 23, 2021 at 5:29 am
- 0 votes
0
This issue drove me crazy for a few hours too.

The solution is to add to nuxt.config.js into build section:
```
  /*
   ** Build configuration
   */
  build: {
    babel: {
      presets(env, [ preset, options ]) {
        return [
          [ "@babel/preset-env", options ]
        ]
      }
    },
```
Make sure you have that thing installed:
npm install --save-dev @babel/preset-env

or in your case with yarn

Updated:

Then I encountered another error

regeneratorRuntime is not defined

Here is working part from my config.nuxt.js
```
build: {
  babel: {
    presets({isServer}) {
      const targets = isServer ? { node: 'current' } : { ie: 11 }
      return [
        [ require.resolve("@babel/preset-env"), { targets }  ]
      ]
    },
    plugins: [
      "@babel/syntax-dynamic-import",
      "@babel/transform-runtime",
      "@babel/transform-async-to-generator"
    ]
  },
```
Login or Signup to reply.

- RaymondChong
- February 23, 2021 at 5:29 am
- 0 votes
0
@babel/preset-env updated,
use old version 7.12.17
https://www.npmjs.com/package/@babel/preset-env/v/7.12.17

Login or Signup to reply.

- 0gravity000
- February 23, 2021 at 7:36 am
- 0 votes
0
I did the following:

npm uninstall @babel/preset-env

npm install @babel/[email protected]

Login or Signup to reply.

- JasonWong
- February 23, 2021 at 8:06 am
- 0 votes
0
I just had the same problem, There’s some issue with the newest @babel/preset-env within the Nuxt.

install the old version and it should work just fine

npm i @babel/[email protected] -S

Login or Signup to reply.

- Ibraah
- February 23, 2021 at 2:07 pm
- 0 votes
0
```
npm uninstall @babel/preset-env
npm install @babel/[email protected]
```
Login or Signup to reply.

- PunitApte
- February 24, 2021 at 12:49 pm
- 0 votes
0
The latest version seems to have this issue resolved, try updating Nuxt to v2.15.2
https://nuxtjs.org/docs/release-notes

Login or Signup to reply.

- chuanweiJ
- February 25, 2021 at 8:53 am
- 0 votes
0
You can try to do：
```
// package.json
"devDependencies": {
   + "@babel/preset-env": "7.12.17",
    "cross-env": "^5.2.0",
    "css-loader": "^3.2.0",
    "node-sass": "^4.14.1",


    "sass-loader": "^8.0.2",
    "style-loader": "^1.0.0"
  },

// package-lock.json
  "@babel/preset-env": {
      +"version": "7.12.17",
     ...,
     "@nuxt/babel-preset-app": {
        "requires": {
           "@babel/preset-env": "7.12.17",
           ...
         }
     }
   }
```
Login or Signup to reply.

- atazmin
- February 27, 2021 at 7:51 am
- 0 votes
0
I had same error when deploying to ElasticBeanstalk
```
Error: /var/app/current/.nuxt/client.js: Cannot find module '@babel/preset-env/lib/utils'
```
upgrading from "nuxt": "v2.14.12", to "nuxt": "v2.15.2", seem to have solved the problem
Login or Signup to reply.

- AlexDohmen
- March 4, 2021 at 9:12 am
- 0 votes
0
lib/utils.js was dropped for @babel/[email protected] and above

as stated above installing the old 7.12.17 might work

for monorepos it may not be enough. upgrading nuxtjs to 2.15.x did the trick for me

Login or Signup to reply.

Please signup or login to give your own answer.

Click here to cancel reply.

Paypal api – Nuxt.js Cannot find module '@babel/preset-env/lib/utils'

Answers