-
Notifications
You must be signed in to change notification settings - Fork 0
Home
Vamsi Nellore edited this page Apr 12, 2018
·
10 revisions
- make a project directory
- change to directory and run command -
npm init
- install react and react-dom -
npm install --save react react-dom
- install dev dependencies -
npm install --save-dev babel-core babel-loader babel-preset-env babel-preset-react css-loader style-loader html-webpack-plugin webpack webpack-dev-server
- for webpack v4 also run -
npm install --save-dev webpack-cli
- create an
App
folder and createindex.js
,index.html
andindex.css
file. - create a
webpack.config.js
file. check the repo for sample. - in
package.json
, add a new property named'create'
under scripts with a value of'webpack'
. - add a section
babel
as follows -"babel" : { "presets" : ["env", "react"]}
.env
- transpiles latest JS code ,react
- transpiles react code. without this the react code will not compile. - run the command -
npm run create
. the dist folder will be created with the final output. - run command to install webpack-dev-server to enable continuous changes being reflected in browser without running npm run create repeatedly.
npm install --save-dev webpack-dev-server
- in
package.json
, under'scripts'
add'start':'webpack-dev-server --open'
React Router Training Link - https://reacttraining.com/react-router/web/example/basic