Nuxt.js 找不到模块“@babel/preset-env/lib/utils”

时间:2021-02-23 00:57:41

标签: vue.js babeljs nuxt.js

我在尝试运行 yarn run dev --port=4000 时遇到此错误

这里是错误:

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

这是我的 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"
  }
}

这是我的 .babelrc:

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

我尝试删除 node_modules 文件夹以及删除 yarn.lock 文件,但没有成功。 babel 版本看起来是正确的。这个错误只是在我玩弄一些代码(不是 package.json)之后才出现 - 这是一个无关的错误。

任何帮助将不胜感激!

9 个答案:

答案 0 :(得分:23)

@babel/preset-env 更新, 使用旧版本 7.12.17 https://www.npmjs.com/package/@babel/preset-env/v/7.12.17

答案 1 :(得分:12)

这个问题也让我疯狂了几个小时。

解决方案是将 nuxt.config.js 添加到 build 部分:

  /*
   ** Build configuration
   */
  build: {
    babel: {
      presets(env, [ preset, options ]) {
        return [
          [ "@babel/preset-env", options ]
        ]
      }
    },

确保你安装了那个东西: npm install --save-dev @babel/preset-env

或者在你的情况下使用纱线

更新:

然后我又遇到了另一个错误

<块引用>

regeneratorRuntime 未定义

这是我的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"
    ]
  },

答案 2 :(得分:5)

我做了以下事情:

npm 卸载 @babel/preset-env

npm install @babel/preset-env@7.12.13

答案 3 :(得分:4)

最新版本好像解决了这个问题,试试更新Nuxt到v2.15.2 https://nuxtjs.org/docs/release-notes

答案 4 :(得分:2)

lib/utils.js 在@babel/preset-env@7.13.0 及以上版本中被删除

如上所述,安装旧的 7.12.17 可能会起作用

对于 monorepos 来说,这可能还不够。将 nuxtjs 升级到 2.15.x 对我有用

答案 5 :(得分:0)

npm uninstall @babel/preset-env
npm install @babel/preset-env@7.12.17

答案 6 :(得分:0)

我在部署到 ElasticBeanstalk 时遇到了同样的错误

Error: /var/app/current/.nuxt/client.js: Cannot find module '@babel/preset-env/lib/utils'

从 "nuxt": "v2.14.12" 升级到 "nuxt": "v2.15.2",好像解决了问题

答案 7 :(得分:-1)

我刚刚遇到了同样的问题,Nuxt 中最新的 @babel/preset-env 存在一些问题。

安装旧版本,它应该可以正常工作

npm i @babel/preset-env@7.12.17 -S

答案 8 :(得分:-1)

你可以尝试这样做:

// 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",
           ...
         }
     }
   }

enter image description here

enter image description here