[email protected] erfordert einen Peer von [email protected]^2.2.0, aber keiner ist installiert

Question

Ich entschuldige mich, wenn dies zuvor gefragt wurde, kann ich es nicht finden. Ich bin ein Anfänger und ich habe versucht, Webpack einzurichten, damit ich lernen kann, reagieren zu lernen. Nachdem Sie ein Tutorial auf youtube, ich mit

npm install --save react react-dom 

reagieren installiert haben und auch versucht,

npm install --save-dev babel-cli babel-preset-react 
npm install babel-preset-env --save-dev 

Und bei dem Versuch, laufen Entwickler mit

ES6 und JSX ermöglicht, erhalte ich diese Fehler:

npm ERR! code ELIFECYCLE 
npm ERR! errno 1 

npm ERR! webpack-starter@1.0.0 dev: `webpack-dev-server` 
npm ERR! Exit status 1 
npm ERR! 
npm ERR! Failed at the webpack-starter@1.0.0 dev script. 
npm ERR! This is probably not a problem with npm. There is likely additional logging output above. 

Das ist mein webpack.config.js

var HtmlWebpackPlugin = require('html-webpack-plugin'); 
const ExtractTextPlugin = require("extract-text-webpack-plugin"); 
var path = require("path"); 

module.exports = { 
    entry: './src/app.js', 
    output: { 
    path: path.resolve(__dirname, "dist"), 
    filename: 'app.bundle.js' 
    }, 
    devServer: { 
    contentBase: path.join(__dirname, "dist"), 
    compress: true, 
    stats: "errors-only", 
    open: true, 
    openPage: '' 
    }, 
    module: { 
    rules: [ 
     {test: /\.scss$/, use: ExtractTextPlugin.extract({fallback: 'style-loader', use: ['css-loader', 'sass-loader']})}, 
    ] 
    }, 
    plugins: [ 
    new HtmlWebpackPlugin({ 
     title: 'Project Demo', 
     minify: { 
     collapseWhitespace: false // For minifying HTML to save on space 
     }, 
     hash: false, // Name of app.bundle.js is changing to see if we're uploading the latest files 
     template: './src/index.html', // Load a custom template (ejs by default see the FAQ for details) 
    }), 
    new ExtractTextPlugin("app.css"), 
    ] 
} 

Ich habe auch .babelrc inside src-Ordner gemacht. Es enthält diese:

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

Während alle über denen die Installation, die einzige Warnung, die ich bekam, war

npm WARN webpack-dev-server@2.5.0 ein Peer von webpack@^2.2.0 erfordert aber keine ist installiert. Sie müssen Peer-Abhängigkeiten selbst installieren.

Aber wenn ich richtig verstehe, ist es kein Fehler, nur eine Warnung. Bedeutung, alles sollte noch funktionieren. Liege ich falsch?

Kann mir bitte jemand sagen, was passiert? Wie kann ich das beheben? Vielen Dank!

EDIT: Hier ist meine package.json auch:

{ 
    "name": "webpack-starter", 
    "version": "1.0.0", 
    "description": "Webpack project starter", 
    "main": "index.js", 
    "scripts": { 
    "dev": "webpack-dev-server", 
    "prod": "webpack -p" 
    }, 
    "author": "Name", 
    "license": "ISC", 
    "devDependencies": { 
    "babel": "^6.23.0", 
    "babel-cli": "^6.26.0", 
    "babel-core": "^6.26.0", 
    "babel-loader": "^7.1.2", 
    "babel-preset-env": "^1.6.1", 
    "babel-preset-es2015": "^6.24.1", 
    "babel-preset-es2015-webpack": "^6.4.3", 
    "babel-preset-react": "^6.24.1", 
    "css-loader": "^0.28.7", 
    "extract-text-webpack-plugin": "^3.0.1", 
    "html-webpack-plugin": "^2.30.1", 
    "node-sass": "^4.5.3", 
    "react": "^16.1.1", 
    "react-dom": "^16.1.1", 
    "sass-loader": "^6.0.6", 
    "style-loader": "^0.19.0", 
    "webpack": "^3.8.1", 
    "webpack-dev-server": "^2.9.4" 
    }, 
    "dependencies": {} 
} 

Answer 1

webpack-dev-server 2.5.0 ist nicht kompatibel mit webpack v3 oder höher und daher müssen Sie Ihren webpack-dev-Server 2.5.1, die dieses Problem behoben aktualisieren . Sehen Sie diese github issue

Sie können dies tun, indem Sie die Version in package.json-2.5.1 ändern und Lauf npm install

oder

Sie können uninstall und reinstall es

npm uninstall webpack-dev-server --save-dev 
npm install webpack-dev-server --save-dev