React 번들링후 배포하기

• npm init -y
• npm install -D react react-dom
• npm i -D webpack webpack-cli
• npm i -D babel-loader @babel/core @babel/preset-env @babel/preset-react
• npm install -D css-loader style-loader
• webpack.config.js 작성
• npx webpack
• npm install -D html-webpack-plugin
• webpack.config.js 작성
• npx webpack
• npm install -D webpack-merge
• npm i -D webpack-dev-server
• webpack.config.dev.js/webpack.config.prod.js/webpack.config.base.js
• 각각 작성
• npm i -D @pmmmwh/react-refresh-webpack-plugin react-refresh
• webpack.config.dev.js에 ReactRefreshPlugin 추가
• npm install -D eslint eslint-plugin-react @babel/eslint-parser
• npm install -D eslint-plugin-jsx-a11y
• .eslintrc.js 따로 작성
• npm install -D prettier
• .prettierrc.js따로 작성
• npm install --save-dev webpack-bundle-analyzer
• webpack.config.prod.js에 BundleAnalyzerPlugin 추가
• package.json에 스크림트 추가

 "scripts": {
    "build:dev": "webpack --config webpack.config.dev.js",
    "build:prod": "webpack --config webpack.config.prod.js",
    "dev": "webpack-dev-server --open --config webpack.config.dev.js",
    "lint": "eslint ./src",
    "pretty": "prettier --write ./"
  },