인터넷이 연결되지 않은 오프라인 환경에서 작업을 진행하는 경우 Node를 이동식 저장 매체에 담아서 로컬에 설치를 해야하며, 패키지 레지스트리 서버에도 연결할 수 없기 때문에 npm install로 패키지를 다운받아 사용하기 어려운 단점이 있다.

Node는 오프라인 환경에서 애플리케이션을 설치하는 방법을 공식적으로 제공하지 않는다고 한다.

그러므로 Node 인스톨러나 의존 패키지를 모두 포함한 아카이브(압축 파일)로 오프라인 환경에서 작업을 구축하는것은 어려운 일이다.

오프라인 환경에서 개발을 진행하기 위해 node_modules를 포함하여 압축받은 파일을 실행하려 해보니 에러가 발생하여 실행이 되지 않았다.

확인해보니 node_modules를 압축하여 사용하는 방법은 문제가 생길 우려가 있어 오프라인에서 node_modules가 설치 가능한 yarn을 사용해보았다.

[온라인] 패키지 install을 위한 구축

최초 환경 구축시에는 온라인 환경이어야 하며
yarn 설치 전에 먼저 Node.js가 설치되어 있어야 한다.

1. yarn 설치

yarn의 설치는 corepack을 사용하라고 되어 있다.
corepack은 Node.js 16.10버전 부터 포함되어 있다.

corepack 이란?
패키지 관리자를 관리하는 프로그램이다.
다양한 버전의 패키지 관리자를 서로 고립시켜서 사용할 수 있도록 해준다.

1-1. Node.js 버전 16.10 이상인 경우

corepack은 처음에는 기본으로 활성화 되어 있지 않으므로 다음 명령으로 활성화 해준다.

corepack enable

1-2. Node.js 버전 16.10 이하인 경우

corepack을 설치해준다.

npm i -g corepack

yarn -v명령으로 잘 설치되었는지 확인해본다.
(yarn -v 명령 실행시 관리자 권한으로 실행하지 않으면 에러가 발생할 수 있다.)

2. yarn 을 이용하여 create-reat-app

프로젝트를 생성할 파일의 경로로 이동하여 create-react-app을 활용하여 리액트를 생성한다.

$ yarn create react-app example

3. 필요한 패키지 설치

3-1. yarn의 package.json 생성하기

yarn을 사용할 수 있는 환경이 Setting 된 후,

yarn init

명령어를 입력하여 폴더에 package.json 파일을 생성하고 라이브러리 dependencies와 연결할 수 있게 해준다.

3-2. 패키지 설치

필요한 패키지를 설치 명령어로 설치해준다.

yarn 패키지 설치 명령어

$ yarn add [package] 
$ yarn add [package]@[version] 
$ yarn add [package]@[tag]

설치된 패키지는 yarn list 명령어를 통해 확인할 수 있다.

4. .yarnrc 파일 생성

프로젝트 루트 경로에서 .yarnrc 파일을 생성 하고 아래 내용을 작성해준다
./npm-packages-offline-cache는 프로젝트 루트 경로 아래에 생성된다.

yarn-offline-mirror "./npm-packages-offline-cache"
yarn-offline-mirror-pruning true

5. node_modules/와 yarn.lock파일 삭제

.yarnrc파일에 설정한 내용을 적용해주기 위해
기존에 설치된 node_modules와 yarn.lock파일을 삭제한다.

6. yarn 캐시 삭제

터미널에서 yarn cache clean을 입력하여 캐시를 삭제한다.

7. yarn install 실행

4~6을 진행한 뒤 yarn install을 실행하면

./npm-packages-offline-cache 디렉터리에 node_module들이 .tgz 형태로 저장되고, 새로운 yarn.lock 파일이 생성된다.

yarn-offline-mirror-pruning은 업데이트 된 패키지를 추가할 때 yarn cache를 먼저 확인하고 yarn cache에 없는 dependency를 가져온다.

🥳 7번까지 완료되면 오프라인 환경에서 yarn install --offline 명령어로
패키지 install이 가능하다!

[ 요약 ]

• .yarnrc 파일에 yarn-offline-mirror 구성 추가
• 기존에 설치된 패키지 파일과 cache 삭제
• yarn install 명령으로 새 yarn.lock 생성

[오프라인] 패키지 install

1. 프로젝트를 오프라인으로 옮긴다.
2. 터미널에 yarn install --offline을 입력하여 ./npm-packages-offline-chache 폴더에서 node_module을 설치한다.

[오프라인] 패키지 install 테스트

1. 기존 node_modules/와 yarn.lock파일 삭제
2. 터미널에서 yarn cache clean
3. 오프라인 환경설정 (wifi 끄기)
4. 터미널에서 yarn install --offline

---

[참고링크]

• [ Yarn 공식문서 ] Running Yarn Offline
• 오프라인에서 Vue 환경만들기
• [ Yarn - Package Manager ] 설치 및 사용방법
• Yarn 사용법 - 1
• 오프라인 환경에 NodeJS 애플리케이션 배포하기
• 오프라인에서 React 환경 만들기
  필요한 패키지 설치