I am having this issue while installing all node_modules. And this is making me crazy.
[email protected] requires a peer of webpack@2 || 3 but none was installed.
Here is my package.json file
{
"name": "react-router-firebase-auth",
"version": "0.1.0",
"private": true,
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-plugin-transform-es2015-modules-monjs": "^6.26.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"react-scripts": "0.9.5"
},
"dependencies": {
"@atlaskit/button": "3.0.0",
"@atlaskit/css-reset": "1.1.4",
"@atlaskit/field-text": "4.0.1",
"@atlaskit/modal-dialog": "2.1.1",
"@atlaskit/page": "4.0.1",
"@atlaskit/util-shared-styles": "2.3.1",
"@shopify/polaris": "^1.5.1",
"babel-eslint": "^7.0.0",
"bootstrap": "^3.3.7",
"eslint": "3.16.1",
"eslint-plugin-react": "6.4.1",
"express": "^4.16.1",
"firebase": "^4.5.0",
"firebase-admin": "^5.4.1",
"firestore": "^1.1.6",
"fixed-data-table": "^0.6.4",
"griddle-react": "^1.8.1",
"jquery": "^3.2.1",
"node-localstorage": "^1.3.0",
"nodemon": "^1.12.1",
"react": "^15.5.3",
"react-bootstrap": "^0.31.3",
"react-bootstrap-button-loader": "^1.0.8",
"react-bootstrap-navbar": "^1.1.0",
"react-data-grid": "^2.0.59",
"react-date-picker": "^6.1.2",
"react-dom": "^15.5.3",
"react-fontawesome": "^1.6.1",
"react-router-dom": "^4.0.0-beta.8",
"react-scripts": "^0.9.5",
"react-transition-group": "^1.2.0",
"reactstrap": "^4.8.0",
"requestify": "^0.2.5",
"simple-react-bootstrap": "^0.2.7",
"styled-ponents": "1.4.6",
"url": "^0.11.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
I am using create-react-app
for this project. So i could not change webpack.config.js file. What am i supposed to do here?
I am having this issue while installing all node_modules. And this is making me crazy.
[email protected] requires a peer of webpack@2 || 3 but none was installed.
Here is my package.json file
{
"name": "react-router-firebase-auth",
"version": "0.1.0",
"private": true,
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-plugin-transform-es2015-modules-monjs": "^6.26.0",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"react-scripts": "0.9.5"
},
"dependencies": {
"@atlaskit/button": "3.0.0",
"@atlaskit/css-reset": "1.1.4",
"@atlaskit/field-text": "4.0.1",
"@atlaskit/modal-dialog": "2.1.1",
"@atlaskit/page": "4.0.1",
"@atlaskit/util-shared-styles": "2.3.1",
"@shopify/polaris": "^1.5.1",
"babel-eslint": "^7.0.0",
"bootstrap": "^3.3.7",
"eslint": "3.16.1",
"eslint-plugin-react": "6.4.1",
"express": "^4.16.1",
"firebase": "^4.5.0",
"firebase-admin": "^5.4.1",
"firestore": "^1.1.6",
"fixed-data-table": "^0.6.4",
"griddle-react": "^1.8.1",
"jquery": "^3.2.1",
"node-localstorage": "^1.3.0",
"nodemon": "^1.12.1",
"react": "^15.5.3",
"react-bootstrap": "^0.31.3",
"react-bootstrap-button-loader": "^1.0.8",
"react-bootstrap-navbar": "^1.1.0",
"react-data-grid": "^2.0.59",
"react-date-picker": "^6.1.2",
"react-dom": "^15.5.3",
"react-fontawesome": "^1.6.1",
"react-router-dom": "^4.0.0-beta.8",
"react-scripts": "^0.9.5",
"react-transition-group": "^1.2.0",
"reactstrap": "^4.8.0",
"requestify": "^0.2.5",
"simple-react-bootstrap": "^0.2.7",
"styled-ponents": "1.4.6",
"url": "^0.11.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
I am using create-react-app
for this project. So i could not change webpack.config.js file. What am i supposed to do here?
- 1 It seems to be a warning, just ignore it – Freez Commented Oct 14, 2017 at 9:19
3 Answers
Reset to default 6Please read this post. It describes what a peer dependency is.
https://stackoverflow./a/34645112/2379376
What that means is that you have webpack not installed at all or you have a different version (webpack 1.x) installed. But this plugin needs webpack in version 2 or 3 to function properly.
What you can do is
npm install webpack -g
So npm will install the newest version of webpack on your system. But now other peer warnings could occur when other loaders need an older version of webpack.
When using Webpack 4:
I've faced the same error but I actually had the webpack 4 installed. In order to solve this I used the instruction on babel-loader documentation and installed the following extra libraries: babel-loader, @babel/core and @babel/preset-env.
Command to install all the required libraries:
npm install -D babel-loader @babel/core @babel/preset-env webpack
package.json devDependencies before the installation:
"devDependencies": {
"chai": "^4.1.2",
"enzyme": "^3.2.0",
"enzyme-adapter-react-16": "^1.1.0",
"expect": "^22.0.3",
"jest-junit": "^3.3.0",
"jest-junit-reporter": "^1.1.0",
"node-sass": "^4.9.2",
"prop-types": "^15.6.0",
"react-test-renderer": "^16.2.0",
"redux-mock-store": "^1.4.0",
"sass-loader": "^6.0.6",
"webpack": "^4.25.1",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.10"
}
After the installation:
"devDependencies": {
"@babel/core": "^7.1.6",
"@babel/preset-env": "^7.1.6",
"babel-loader": "^8.0.4",
"chai": "^4.1.2",
"enzyme": "^3.2.0",
"enzyme-adapter-react-16": "^1.1.0",
"expect": "^22.0.3",
"jest-junit": "^3.3.0",
"jest-junit-reporter": "^1.1.0",
"node-sass": "^4.9.2",
"prop-types": "^15.6.0",
"react-test-renderer": "^16.2.0",
"redux-mock-store": "^1.4.0",
"sass-loader": "^6.0.6",
"webpack": "^4.25.1",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.10"
}
Hope it helps
Install webpack globally in node environment as well as in development(as dev dependency). As main function of webpack is to bundle JavaScript files for usage in a browser.As each time you made changes to index.js (entry point of npm) at development time then you have to run webpack to make changes in bundle.js file also, so we need to install in both the environment(ie. node environment and development environment) Run below mand to solve the issue:
npm install -g [email protected]
npm install --save-dev [email protected]
Here I am using 3.10.0 for webpack. You can use 4 as well. I think this will help.