Webpack + Babel : 디렉토리에 상대적인 프리셋 "es2015"를 찾을 수 없습니다.

Question

Webpack 및 Babel을 사용하는 React 프로젝트가 있습니다. 사무실 컴퓨터에서 만들었을 때, Webpack은 잘 돌아갔습니다. 나는 내 개인 컴퓨터에 프로젝트를 복제 할 때, 다음과 같은 오류 준 :

여기

ERROR in ./react_minesweeper.jsx 
Module build failed: Error: Couldn't find preset "es2015" relative to directory "/Users/louisstephancruz/Desktop" 
at /Users/louisstephancruz/Desktop/w6d5/minesweeper/node_modules/babel-core/lib/transformation/file/options/option-manager.js:298:19 
at Array.map (native) 
at OptionManager.resolvePresets (/Users/louisstephancruz/Desktop/w6d5/minesweeper/node_modules/babel-core/lib/transformation/file/options/option-manager.js:269:20) 

이야 내 webpack.config.js : 노드의

{ 
    "name": "minesweeper", 
    "version": "1.0.0", 
    "description": "", 
    "main": "webpack.config.js", 
    "scripts": { 
    "test": "echo \"Error: no test specified\" && exit 1", 
    "start": "webpack-dev-server --inline" 
    }, 
    "keywords": [], 
    "author": "", 
    "license": "ISC", 
    "devDependencies": { 
    "babel": "^6.5.2", 
    "babel-core": "^6.17.0", 
    "babel-loader": "^6.2.5", 
    "babel-preset-es2015": "^6.16.0", 
    "babel-preset-react": "^6.16.0", 
    "webpack": "^1.13.2", 
    "webpack-dev-server": "^1.16.2" 
    }, 
    "dependencies": { 
    "react": "^15.3.2", 
    "react-dom": "^15.3.2" 
    } 
} 

내 버전은 다음과 같습니다

여기

module.exports = { 
    entry: './react_minesweeper.jsx', 
    output: { 
    path: './', 
    filename: 'bundle.js', 
    }, 
    module: { 
    loaders: [ 
     { 
     test: [/\.jsx?$/, /\.js?$/], 
     exclude: /(node_modules)/, 
     loader: 'babel', 
     query: { 
      presets: ['es2015', 'react'] 
     } 
     } 
    ] 
    }, 
    devtool: 'source-map', 
    resolve: { 
    extensions: ['', '.js', '.jsx' ] 
    } 
}; 

내가 package.json입니다 : v5.6.0 내 npm 버전 : 3.6.0

Answer 1

npm i 또는

npm install은 package.json 종속성 및 dev에 종속성이있는 모든 패키지를 설치해야합니다. 특정 패키지는 당신이 할 수 있습니다 설치되어있는 경우

---

확인하려면 다음

npm ls babel-preset-es2015

어떤 이유로 당신의 NODE_ENV이 production이며, 당신이 사용할 수 dev에 종속성을 설치하고자하는 경우 :

npm install --only=dev

반대로 다음을 p

npm install --only=prod

---

나는 다음과 같은 내용으로 당신의 repo의 루트에 .babelrc을 만드는 것을 권 해드립니다 : 이미 내장 된 코드를 처리하고 모든 개발 종속성에 액세스 할 필요가 없습니다 roduction 기계

당신이 SPE에 할 수있는 웹팩 설정에 대한

---

{ "presets": [ "es2015", "react" ] }

다른 옵션을 cify : 결속의 루트 디렉토리에서 개최해야하며, 당신이 생략 할 수 있습니다 확장 프로그램을 (모듈로 어떤 파일 확장자를 치료하는 곳

이

{ context: __dirname 
, resolve: { root: __dirname, extensions: [ '.js', '.jsx', '.json' ] } 
} 

이 구성의 나머지 부분뿐만 아니라,이 웹팩을 알려줍니다 require/import 진술).

해당 비트에 대한 자세한 내용은 webpack의 resolve.extensions을 확인하시기 바랍니다.

Answer 2

npm install babel-preset-es2015 

그게 도움이 되나요? (당신의 NODE_ENV 환경 변수 production을 동일하지 않기 때문에 너무 오래)

Answer 3

"/ 사용자/사용자"디렉토리에서 .babelrc (숨김) 파일을 제거했을 때이 문제가 해결되었습니다.

Answer 4

이상한 이유로 컴퓨터를 다시 시작한 후에 아무 것도 변경되지 않아도 프로젝트를 컴파일하지 못했습니다.

제안 된 솔루션이 도움이되지 않으면 webpack.config의 사전 설정에서 es2015을 제거하면됩니다.

나는 이것에 대해 다른 설명이 없지만 최소한 시간이 지나면 잘 작동합니다.

내 webpack.config 지금이 있습니다 경우 사람에

{ 
    test: /\.(js|jsx)$/, 
    use: [{ 
     loader: 'babel-loader', 
     options: { 
      babelrc: false, 
      presets: ['env', 'react'] 
     } 
    }] 
}