본문 바로가기
개발/React

[React] webpack 설치하기 1

by yo.na 2022. 2. 15.

create-react-app 명령어 없이 webpack 설치하기

1. npm init 

전부 엔터치다가 author 만 입력

    author : 본인이름 

- > package.json 파일이 생성된다.

 

2. npm i react react-dom

i : 설치 단축어

package.json 파일의 dependencies 에 생성된다

 

3. npm i -D webpack webpack-cli

-D : 개발할때만 쓰인다를 의미하는 옵션.

실제 서비스에는 웹팩 필요 x 

package.json 파일의 devdependencies 에 생성된다.

 

4.  npm i -D <패키지들>

@babel/core
@babel/preset-env
@babel/preset-react
babel-loader

npm i react-refresh @pmmmwh/react-refresh-webpack-plugin -D

npm i -D webpack-dev-server 서버필요

 

5. 생성된 package.json 파일

"dependencies": {  
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  },
  "devDependencies": {
    "@babel/core": "^7.17.0",
    "@babel/plugin-proposal-class-properties": "^7.16.7",
    "@babel/preset-env": "^7.16.11",
    "@babel/preset-react": "^7.16.7",
    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.4",
    "babel-loader": "^8.2.3",
    "react-refresh": "^0.11.0",
    "webpack": "^5.68.0",
    "webpack-cli": "^4.9.2",
    "webpack-dev-server": "^4.7.4"
  }

 

 

참고자료

제로초 유튜브