https://github.com/vikbert/webpack-react-from-scratch
https://github.com/vikbert/webpack-react-from-scratch
Last synced: 9 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/vikbert/webpack-react-from-scratch
- Owner: vikbert
- Created: 2020-01-17T10:50:05.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2023-01-05T05:16:59.000Z (about 3 years ago)
- Last Synced: 2025-06-03T15:26:17.513Z (10 months ago)
- Language: JavaScript
- Homepage:
- Size: 1.02 MB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 25
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Webpack + react from scratch
## 01: Init package.json
`npm init -y`
## 02: Init webpack & Webpack-cli
- [x] create new branch named `feature/02_webpack_init`
- [ ] install packages `webpack` & `webpack-cli`
- [ ] create directories and init files `dist/`, `src/index.js`
- [ ] create init config file `webpack.config.js`
## 03: Config devserver & use HTML template
- [x] create new branch named `feature/03_devserver`
- [ ] install packages `ebpack-dev-server`
- [ ] create directories and init files `public/index.html`
- [ ] config `devserver` in `webpack.config.js`
- [ ] use template html with `html-webpack-plugin`
## 04: Load `css` and `scss`
- [x] create new branch named `feature/04_css_scss`
- [ ] install packages `css-loader`, `style-loader`
- [ ] install package `sass-loader`, `node-sass`
- [ ] config webpack to load `css`, `sass`
## 05: Load `react` with `babel-loader`
- [x] create new branch named `feature/05_react`
- [ ] install babel packages
- [ ] `@babel/core`
- [ ] `@babel/preset-env` compiling ES6 down to ES5
- [ ] `babel-loader` loader for webpack
- install `@babel/preset-react` for compiling JSX and other down to JavaScript
- config webpack to make all work together
## 06: use `eslint` & `prettier`
- [x] create new branch named `feature/06_eslint`
- [ ] install `loader-eslint`
- [ ] config `eslint` in package.json
- [ ] install more packages to combine `eslint` and `prettier`
- [ ] config `prettier` in package.json