programing

'@babel/core' 모듈을 찾을 수 없습니다.

mytipbox 2023. 2. 27. 23:23
반응형

'@babel/core' 모듈을 찾을 수 없습니다.

이 webpack4/react 튜토리얼은 다음과 같습니다.

https://www.youtube.com/watch?v=deyxI-6C2u4

나는 그가 npm을 운영하는 부분이 시작될 때까지 정확히 따라왔다.차이점은 앱이 실행되고 내 앱은 다음 오류가 발생한다는 것입니다.

'@babel/core' 모듈을 찾을 수 없습니다.

완전한 오류:

ERROR in ./src/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module '@babel/core'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\joeyf\Desktop\Code\Github\webpack4-sample\node_modules\babel-loader\lib\index.js:5:15)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
    at Function.Module._load (module.js:497:3)
 @ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/index.js main[2]

babel-core를 재설치해 봤지만 아직 찾을 수 없다.여기 제 소포가 있습니다.json:

{
  "name": "webpack4-sample",
  "version": "1.0.0",
  "description": "A sample setup of Webpack4 with React and Babel",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --mode development --open --hot",
    "build": "webpack --mode production"
  },
  "author": "Joey Fenny",
  "license": "ISC",
  "dependencies": {
    "babel": "^6.23.0",
    "babel-cli": "^6.26.0",
    "react": "^16.4.2",
    "react-dom": "^16.4.2"
  },
  "devDependencies": {
    "babel-core": "^7.0.0-rc.4",
    "babel-loader": "^8.0.0",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "html-webpack-plugin": "^3.2.0",
    "webpack": "^4.17.1",
    "webpack-cli": "^3.1.0",
    "webpack-dev-server": "^3.1.6"
  }
}

내 webpack.config.js:

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
    entry: './src/index.js',
    output: {
        path: path.join(__dirname, '/dist'),
        filename: 'index_bundle.js'
    },
    module: {
        rules: [{
            test: /\.js$/,
            exclude: path.join(__dirname, '/node_modules'),
            use: {
                loader: 'babel-loader'
            }
        }]
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: './src/index.html'
        })
    ]
}

다음은 git repo 링크입니다.

https://gitlab.com/jfny/webpack4-sample

무슨 일인지 아는 사람?감사해요.

실행해 보세요.

npm install @babel/core --save

에 당신의 babel은 package ★★★★★★★★★★★★★★★★★★★★★★★★★★★★」babel-core와는 같지 않을 것이다@babel/core.

최근 버전7로의 Babel 업그레이드로 노드 패키지의 이름이 변경되었습니다.

예를 들어, 이제 를 설치해야 합니다.

npm install --save-dev @babel/core @babel/preset-env

그리고.

npm install --save-dev @babel/preset-react

리액트를 사용할 수 있습니다.그런 다음 .babelrc 파일에서 다음을 사용할 수 있습니다.

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ]
}

또는 패키지에 .babelrc가 없는 경우.json:

...
"keywords": [],
"author": "",
"license": "ISC",
"babel": {
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ]
},
"devDependencies": {
...

자세한 내용은 이 웹 팩 + Babel + React 설정을 참조하십시오.

기존 파일을 제거했습니다.npm uninstall babel-core babel-preset-env babel-preset-react

npm install --save-dev @babel/core @babel/preset-env @babel/preset-react나한테는 딱 맞는 것 같아

: 는 babel-node를 사용하여 했습니다.npm i @babel/core --save-dev패키지가 패키지를 하고 @babel/core를 사용하여 했습니다.npm i @babel/core --save아!

내 경우엔 babel 6를 제거해야 했다.

npm uninstall --save-dev babel-cli  babel-core babel-polyfill babel-preset-es2015 babel-preset-stage-2 babel-register

그 후 babel 7을 다시 설치합니다.

npm i  --save-dev  @babel/cli  @babel/core @babel/node  @babel/polyfill  @babel/preset-env

나한테는 효과가 있었어요

다음 명령을 사용하여 이 문제를 해결할 수 있습니다.

npm install @babel/core --save

babel-loader@8에는 Babel 7.x('@babel/core' 패키지)가 필요합니다.Babel 6.x('babel-core')를 사용하려면 'babel-loader@7'을 설치해야 합니다.

npm install @babel/core --save가 작동하지 않으면 node_install을 제거하고 다시 설치합니다.

다음 명령을 실행하는 dev Dependencies에서 모든 babel 모듈을 제거하여 동일한 오류를 해결했습니다.

npm install -D babel-loader @babel/core @babel/preset-env

위의 명령어가 기능하지 않을 경우 다음 링크를 참조할 수 있습니다.

[https://github.com/babel/babel/issues/8599#issuecomment-417866691]

수정 내용:

 npm install --save-dev babel-loader@7 babel-core babel-preset-env webpack webpack-cli -D

몇 시간 동안 이 문제를 해결하고 있었는데 패키지에 "Devendencies" 섹션을 추가하자 이상하게 사라졌습니다.json 파일을 작성하고 @types 의존관계를 이 파일로 이동했습니다.

리액트 어플리케이션이 있고 에러가 발생했을 경우는, babel 설정을 다음과 같이 변경합니다.

 {
"presets": [
    [
        "@babel/preset-env",
        {
            "useBuiltIns": "entry",
            "corejs": 3,
            "modules": false
        }
    ],
    "@babel/preset-react"
],
"plugins": [
    ["@babel/transform-async-to-generator"],
    ["@babel/plugin-transform-runtime"],
    ["@babel/syntax-dynamic-import"],
    ["@babel/plugin-transform-classes", {
    "loose": true
    }],
    [
        "babel-plugin-transform-builtin-extend",
        {
            "globals": ["Error"]
        }
    ]
]

}

리액트, 웹팩, 바벨, jsx를 시작하는 사람들을 위해, 나는 문제가 있다.npm run build

ERROR in ./src/app.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module 'babel-core'

각 컴포넌트를 단계적으로 설치하려고 하면 패키지 간에 버전 경합이 발생할 수 있습니다.즉,package.json이렇게 줄서다

  "dependencies": {
    "@babel/core": "^7.13.15",
    "@babel/preset-env": "^7.13.15",
    "@babel/preset-react": "^7.13.13",
    "babel-loader": "^7.1.5",
    "webpack": "^5.33.2",
    "webpack-cli": "^4.6.0"

보고가 로드되지 않은 것은 확실합니다.babel-loader내가 이 일을 하지 않았기 때문은 아니다babel-loader설치된.그렇기 때문에 재인스톨을 시도해 보겠습니다.npm i babel-loader.

그리고 이 메시지를 받았다.

$ npm install babel-loader
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: indecision-app@1.0.0
npm ERR! Found: webpack@5.33.2
npm ERR! node_modules/webpack
npm ERR!   webpack@"^5.33.2" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer webpack@"2 || 3 || 4" from babel-loader@7.1.5
npm ERR! node_modules/babel-loader
npm ERR!   babel-loader@"^7.1.5" from the root project

Webpack v.5를 사용하고 있는 것을 알 수 있었습니다.따라서, 저는babel-loader부터package.json줄서서 하다npm i babel-loader다시.

이번에,npm run build성공했습니다!

Windows 상에서 실행해 주세요.%USERPROFILE%\.quokka

~/.quokka설정은 로 제한되어 있습니다.config.json파일 및 존재하는 패키지~/quokka/node_modules.

다음 내용을 입력해 주세요.config.js,

{
  "pro":true, 
  "babel": {
    "presets": ["@babel/preset-env", " @babel/preset-react"],
    "plugins": [
      ["@babel/plugin-proposal-pipeline-operator", { "proposal": "minimal" }],
      ["@babel/plugin-proposal-decorators", { "legacy": true }],
      ["@babel/plugin-proposal-class-properties", { "loose": true }]
    ]
  }
}

언급URL : https://stackoverflow.com/questions/52067944/cannot-find-module-babel-core

반응형