npm, yarn

1. 에러 'react-scripts' is not recognized as an internal or external command,

npm start, yarn start 로 React App 을 실행할 때, react-script 에러를 발견할 수 있다. 이 문제는 NPM 혹은 Yarn 프로그램이 node_modules 폴더에 설치되어 있어야 할 react-script 모듈을 찾지 못해 발생하는 것이다. react-script 패키지는 너가 새로운 React App 을 CRA 로 설치했을 때 설치 되었어야 한다.

이 문제를 해결하기 위해, package.json 파일을 확인하고, 프로젝트의 dependency 에 react-script 가 목록에 있는지 확인한다. 패키지가 이미 목록에 있다면, npm install / yarn 으로 너의 dependency 를 다시 설치한다. 그러면, react-scripts 가 node_modules 폴더 하위에 다시 설치되며 해결될 것이다.

 

그걸로도 해결이 안된다면, node_modules 폴더를 날리고, dependency 를 처음부터 다시 설치한다.

rm -rf node_modules/
yarn # or npm install

목록에 react-scripts 가 없다면 그냥 간단히 npm 이나 yarn 을 이용해서 의존성 모듈을 설치해주면 된다

yarn add react-scripts # or npm install react-scripts

 

2. yarn

Facebook 에서 만든 JS 패키지 매니저이다. 

프로젝트를 시작할 때 초기화해서 package.json 을 생성하려면

yarn init

package.json 으로부터 의존성 모듈을 모두 설치하려면

yarn # or yarn install

특정 의존성 모듈을 설치하려면, (특정 범주의 의존성을 추가하려면, 옵션을 준다)

yarn add [package]
yarn add [package] --dev

 

yarn.lock 파일은 설치된 모듈의 버전을 저장해 어디서나 같은 버전과 구조의 의존성을 가지게 한다. yarn 에서는 yarn / yarn install 때마다 yarn.lock 파일이 생성된다. package-lock.json 과 비슷하다

 

 

node_modules 는 .gitignore 에 제외되는 폴더에 이미 써 있다

 

git clone 후,

node_modules 폴더 없으니까, yarn install / yarn / npm install 해서 의존성에 맞게 모듈을 설치해준다

package.json 에 있는 패키지를 기반으로 프로젝트 폴더 내에 node_modules 폴더가 생기면서 필요한 모듈이 설치된다

 

npm install / yarn install 을 해야 npm run start / yarn start 할 수 있다

 

yarn.lock / package_lock.json 파일은 yarn install / npm install 하면 로컬에 사용하는 패키지 버전에 맞게 덮어씌워지고,

git 에 올라가도 다른 사람들 개발환경에 영향을 미치지는 않는다

 

패키지 매니저로 yarn 을 사용할 때는, 프로젝트 로컬에서 npm install yarn 을 하는 게 아니라 전역으로 설치해줘야 한다 주로 옵션 -g 를 준다. 특정 디렉토리 안에서만 쓰이는 모듈이 아니라 전역으로 설치해 명령어를 이용하는 것

 

yarn init 하면 초기화되면서 package.json 이 다시 생성됨

 

패키지를 설치할 때 npm 과 yarn 을 혼용해 사용하지 않는 것이 좋다. npm 과 yarn 의 패키지 관리방식이 다르기 때문에

 

3. npm

Node Package Manager 의 약자로, Node.js 에서 사용하는 모듈들을 패키지로 만들어서 npm 을 통해 관리, 배포한다

다른 사람들이 만들어놓은 모듈들을 npm 을 통해 설치해 사용이 가능하다는 것

해당 모듈이 사용하는 다른 모듈의 의존성 또한 자동으로 해결해준다

npm 은 node.js 를 설치하기만 하면 자동으로 설치된다

 

npm 에서 패키지 관리는 package.json 파일로 관리한다

 

package.json 을 생성하는 방법은 yarn init / npm init 하는 것. 하면 문답 형식으로 package.json 작성을 돕는다, 이름, 버전, git 저장소 등등을 쓰라고 나온다 (git 에서 프로젝트를 clone 했을 때는 필요없음)

 

package.json 파일에 작성이 쭉 되어있고, 중요한 부분은 scripts 와 dependencies 이다. scripts 에는 우리가 run 명령어를 통해 실행할 것들을 적어두고, dependencies 에는 설치할 모듈을 적는다.

package.json 파일이 정리되면, 배포를 해야할 때 파일만 같이 배포를 하면, 해당 프로그램 개발에 사용되었던 모듈을 그대로 install 할 수 있게 된다.

 

4 에러

react-script eslint 의존성 버전과 **의 의존성 버전이 맞지 않는 경우 발생한다. package.json 에 써있는 버전 대로 특정 패키지를 설치했는데, 나온 에러였음. 그래서 그냥 버전 지정하지 않고 yarn add eslint -dev 해줬음. 그러면 yarn.lock 파일은 덮어씌워지나, 다른 사람들 개발에 문제 없음

 

 

1. https://sebhastian.com/react-scripts-not-recognized-fix/

https://stackoverflow.com/questions/47928735/react-scripts-is-not-recognized-as-an-internal-or-external-command

2. https://heropy.blog/2017/11/25/yarn/

3. https://web-front-end.tistory.com/3

4.