npm 설치 튜토리얼
Vue 학습 소개의 첫 번째 장에서 Node.js 사용
머리말
시대의 지속적인 발전에 따라 프론트엔드 학습 기술이 점점 더 중요해지고 있어 많은 사람들이 프론트엔드 학습을 배우기 시작했습니다. 이 글에서는 프론트엔드 학습-npm 설치의 기본 내용을 소개합니다.
1. npm이란 무엇입니까?
npm 은 NodeJS의 패키지 관리자이며 vue-cli 스캐폴딩 템플릿은 node 아래의 npm을 기반으로 설치를 완료합니다.
관련 소개 ~
webpack: 주요 목적은 리소스 병합 및 패키징과 같이 CommonJS 구문을 통해 브라우저 측에 게시해야 하는 모든 정적 리소스를 준비하는 것입니다.
vue-cli: Vue 프로젝트 템플릿을 빠르게 생성하기 위해 공식적으로 제공되는 스캐폴딩입니다.
2. 환경 변수 설치 및 구성
1. NodeJS 다운로드 및 설치
Windows에서의 NodeJS 설치는 상대적으로 편리합니다.(v0.6.0 버전 이후에는 Windows Native 지원) 공식 웹사이트( https://nodejs.cn/download/ )에 직접 방문하기만 하면 됩니다. 여기에서 Windows 설치 패키지를 선택할 수 있습니다. (.msi) - 64비트 설치.
또는 공식 웹사이트 http://nodejs.org/ 로 직접 이동하세요.
- 설치 과정은 기본적으로 완료될 때까지 " NEXT "입니다.
Windows에서는 msi 파일 설치 중에 경로 시스템 변수가 직접 추가됩니다. 변수 값은 "D:\RunSoftware\nodejs"와 같은 설치 경로입니다.
- nodejs 설치 성공 확인:
단축키 win+R —> cmd 명령줄 입력, dos 창 입력: 를 입력node -v하고 버전 번호가 올바르게 인쇄되는지 확인하세요!
Node에는 npm이 함께 제공되는데, 이를 입력npm -v하고 버전 번호가 올바르게 출력되는지 확인해보세요!
2.npm 구성
Npm은 NodeJS 모듈로 관리되는데, 먼저 npm의 전역 모듈의 저장 경로 와 캐시 경로를 구성할 수 있습니다 .
(1) node_cache 및 node_global 두 개의 디렉터리를 만듭니다 .
이 두 폴더를 NodeJS의 기본 디렉터리에 넣으려면 NodeJs 아래에 "node_global"과 "node_cache"라는 두 폴더를 만듭니다.
(2 ) 구성
npm config set prefix "D:\RunSoftware\nodejs\node_global"
npm config set cache "D:\RunSoftware\nodejs\node_cache"
이 단계를 설정하지 않으면 npm 전역 설치 패키지가 노드 설치 폴더에 없습니다.
이 단계에서 오류(예: 작업이 허용되지 않음, mkdir 'D:\RunSoftware\nodejs')가 있는 경우 관리자 권한으로 cmd 명령줄을 여십시오. (3) 환경 변수
구성 환경 변수 대화 상자를 입력하고 시스템 변수 아래에 새 " NODE_PATH "를 만든 다음 "D:\RunSoftware\nodejs\node_global\node_modules"를 입력합니다.
모듈의 기본 주소가 변경되었으므로 위의 사용자 변수를 그에 맞게 변경해야 합니다(사용자 변수 "PATH"가 "D:\RunSoftware\nodejs\node_global\"로 변경됨) . 그렇지 않으면 모듈을 사용할 때 입력 명령을 실행하면 "xxx는 내부 또는 외부 명령, 실행 가능한 프로그램 또는 배치 파일로 인식되지 않습니다." 오류가 발생합니다.
(4) Node.js Taobao Mirror Accelerator(cnpm)를 설치합니다. 이렇게 하면 다운로드 속도가 훨씬 빨라집니다~
-
미러 사이트 구성:
npm config set registry=https://registry.npm.taobao.org
-
미러 사이트가 괜찮은지 확인하세요.
npm config get registry
-
그런 다음 다음 명령을 입력하거나
npm install -g cnpm --registry=https://registry.npm.taobao.org
다음 명령을 입력하십시오.
# -g 就是全局安装
npm install cnpm -g
# 或使用如下语句解决 npm 速度慢的问题
npm install --registry=https://registry.npm.taobao.org
- 시스템 변수 경로 의 내용을 추가합니다 .
왜냐하면 cnpm은 D:\RunSoftware\nodejs\node_global에 설치되고 시스템 변수 경로에는 이 경로가 포함되지 않기 때문입니다. 따라서 시스템 변수 path 아래에 이 경로를 추가한 후 정상적으로 cnpm을 사용할 수 있습니다.
- 그런 다음 다음 명령을 입력하여
cnpm -v결과를 확인합니다.
설치 과정이 다소 느릴 수 있으니 인내심을 갖고 기다려주세요! cnpm이 설치되어 있지만 아껴서 사용해 보세요 !
설치 위치는 다음과 같습니다.
이제 npm 설치가 성공적으로 종료되었습니다! 오늘 제가 이야기할 내용은 위와 같습니다. 이 글에서는 npm 설치에 대해 간략하게 소개할 뿐입니다. 우리가 탐구할 더 많은 지식이 기다리고 있습니다! 이제 vue-cli 학습 여정을 시작할 수 있습니다~ 친구 여러분, 제 다른 기사 vue-cli 자세한 튜토리얼을
읽어 보세요 . 여러분 모두에게 도움이 되기를 바랍니다~