리액트 추가 설정 - Extensions 설정

비주얼 스튜디오 코드 플러그인을 추가합니다.

file => preferences => extensions 

1. Reactjs code snippets - 자동 완성 코드 해주는 플로그인입니다.

 

많이 쓰이는 키워드

RCC => 기본 리액트 컴포넌트 코드를 생성합니다. => 강추

RCCP => 리액트 컴포넌트를 프로퍼티 타입과 함께 생성합니다.

RCFC => 리액트 컴포넌트를 생명주기 함수와 함께 생성합니다.

RPC => 리액트 퓨어 컴포넌트를 생성합니다.

RSC => 함수형 컴포넌트를 생성합니다.

RSCP => 함수형 컴포넌트를 프로퍼티 타입과 함께 생성합니다

2.  Prettier 플러그인 => 자동 포맷터 ,  자동 줄바꿈

사용법은 ctrl + shift + P  누른후 프롬프트에서 format 을 입력해서 선택하거나

alft + Shift + F 로 단축키로 실행합니다.

 

 

3. package.json 에 Dependencies  를 추가할 경우

"react-router-dom": "^6.22.0", 

이것을 추가하면

npm install react-router-dom 를 실행하여 모듈 패키지가 설치 되도록 한다.

 

4. 

npm install -D webpack webpack-cli webpack-dev-server html-webpack-plugin

npm install -D @babel/core @babel/preset-env babel-loader

npm install -D typescript ts-loader