'@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
'programing' 카테고리의 다른 글
각도 2: 사용자에게 태그를 표시하지 않고 JSON 응답에서 HTML을 렌더링하려면 어떻게 해야 합니까? (0) | 2023.02.27 |
---|---|
오류 메시지 "li: 'key' is not prop" (키: 프로펠러가 아닙니다)가 표시됩니다. (0) | 2023.02.27 |
명령줄에서 sql plus까지 단일 명령어를 발행하려면 어떻게 해야 합니까? (0) | 2023.02.27 |
WooCommerce에서 프로그래밍 방식으로 가변 제품 및 두 가지 새로운 특성 생성 (0) | 2023.02.27 |
material-ui 앱바를 material-ui-next와 함께 사용하여 오른쪽 또는 왼쪽으로 이동하는 올바른 방법은 무엇입니까? (0) | 2023.02.27 |