Webpack, ReactJS and Babel

0

I am new in Webpack and my doubt is that when I install the DevDependencies such as the webpack itself generates the folder Node_Modules in this folder there are more development dependencies, so I want to use React and I already have it installed but I see that you need a loader like Babel, what happens is that in the folder Node_Modules I realized that there are several folders of babel. What I want to get to is the following.

My "package.json" file is this

{
"name": "ProyectoFinal",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"dev": "webpack --mode=development",
"build": "webpack --mode=production"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.2.0",
"webpack-cli": "^2.0.13"
},
"dependencies": {
"bootstrap": "^4.0.0",
"jquery": "^3.3.1",
"jquery-validation": "^1.17.0",
"jquery-validation-unobtrusive": "^3.2.8",
"react": "^16.2.0",
"react-dom": "^16.2.0"
 }
 }

But I have seen on a page that has it in the following way

{
 "name": "webpack-for-react",
 "version": "1.0.0",
 "main": "index.js",
 "license": "MIT",
 "dependencies": {
 "react": "^16.2.0",
 "react-dom": "^16.2.0",
 "react-prop-types": "^0.4.0",
 "react-router-dom": "^4.2.2",
 "semantic-ui-react": "^0.77.1"
  },
  "devDependencies": {
  "babel-core": "^6.26.0",
  "babel-loader": "^7.1.3",
  "babel-preset-env": "^1.6.1",
  "babel-preset-react": "^6.24.1",
  "babel-preset-stage-1": "^6.24.1",
  "css-loader": "^0.28.10",
  "html-webpack-plugin": "^3.0.4",
  "style-loader": "^0.19.1",
  "webpack": "^4.0.0",
  "webpack-dev-server": "^3.0.0"
  }
 }

For example in the development dependencies (devDependencies) are babel-core, babel-loader, among others and I just install webpack without more, that is npm i --save-dev webpack , I get that in the folder NODE_MODULES, then there my doubt. It is assumed that it is already installed, right? or am I wrong. If someone could clarify this confusion I would appreciate it.

    
asked by Ronald Sanchez 23.03.2018 в 18:25
source

0 answers