(This is a sample seed project for creating react projects - uses webpack and babel)
Step by step
-
create the project folder
-
npm init
-
npm install webpack webpack-cli
-
npm install @babel/core babel-loader @babel/preset-env @babel/preset-react
-
create a minimal .babelrc file to add presets
-
create a minimal webpack config file to configure babel-loader module
-
npm install react and react-dom
-
create a sample component as component/Form.js
-
create src/index.js - which is the entry point for webpack
-
now run "npm run build" to create "dist/main.js"
-
add these two more bundles for handling html with webpack: html-webpack-plugin and html-loader
-
and add the module definition for html-loader and plugins for html-webpack-plugin in webpack configuration
-
add a template html file at src/index.html
-
run the build again - npm run build
-
npm install webpack-dev-server --save-dev
-
you are now ready to start the application: npm start
-
references: https://www.valentinog.com/blog/babel/