Vue 환경 구축에 대한 간단한 튜토리얼의 자세한 예

vue를 사용하여 프런트엔드 프레임워크를 개발하려면 먼저 환경이 있어야 합니다. 이 환경에는 node의 도움이 필요하므로 먼저 node를 설치하고 node에서 npm을 사용하여 필요한 종속성 등을 설치해야 합니다. 이 기사는 주로 Vue 환경 구축에 대한 간단한 튜토리얼을 소개하며, 관심 있는 친구들이 이를 참조하여 모든 사람에게 도움이 되기를 바랍니다.

①nodejs 설치

https://nodejs.org

nodejs,(lts)를 다운로드 후 설치시 동의를 누르고 다음으로 넘어갑니다.

npm이 함께 제공됩니다(npm은 패키지 관리자입니다. 용도는 무엇입니까? 창고입니다. 사용해야 하는 경우 npm을 설치 packageName하면 됩니다.)

테스트:

②cnpm 설치( Taobao 미러, )

npm install -g cnpm --registry=https://registry.npm.taobao.org

3vue-cli

windows 컴퓨터를 설치하고, widnows+r을 동시에 누르고 cmd를 입력한 후 Enter를 클릭하여 명령줄 모드로 들어갑니다.

입력; 명령줄 지침에 따라 마지막으로 Enter
(npm install vue-cli -g(cnpm은 Taobao 이미지 설치 후 npm과 동일))를 클릭합니다. cnpm install --global vue-cli

4webpack

npm 설치 install webpack -g

　

4vue-cli 설치 후 제공되는 vue 지침에 따라 템플릿 프로젝트 생성

선생님이 제공하는 템플릿 압축 패키지(tpls.zip)를 사용하세요

아래에 tpls.zip을 업로드했습니다. D 드라이브의

파일에 있는 "Information"에서 새 vue_cli를 생성하고 압축이 풀린 각 파일을 vue_cli에 복사합니다.

⑤프로젝트에 필요한 종속성을 설치합니다

위 폴더의 압축을 푼 후 해당 디렉터리에 들어가서 다음 명령을 실행합니다.

cnpm install

⑥명령을 실행하여 개발 서버를 시작합니다

npm run dev

참고: 만약 Taobao 미러 설치가 실패하는 경우 해결책:

먼저 프록시를 npm config set proxy null로 설정한 다음 Taobao 미러를 다시 설치하세요

관련 권장 사항:

Vue 컴포넌트 간 부모-자식 통신을 위한 채팅방 상세 설명 예시

모의 데이터를 활용한 Vue 상세 설명 예시

vue에서 더 많은 기능의 스크롤 로딩 구현 방법

위 내용은 Vue 환경 구축에 대한 간단한 튜토리얼의 자세한 예의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!