vuejs에 종속성을 설치하는 방법-View.js-php.cn

집

웹 프론트엔드

View.js

vuejs에 종속성을 설치하는 방법

青灯夜游

Sep 26, 2021 pm 05:32 PM

vue

vuejs 종속성을 설치하는 방법: 1. node 및 cnpm을 설치합니다. 2. vue-cli 스캐폴딩 구성 도구를 설치합니다. 3. vue-cli를 사용하여 프로젝트를 빌드합니다. 4. cmd 명령 창을 열고 cd 명령을 사용합니다. 특정 프로젝트 폴더 Medium을 입력합니다. 5. "cnpm install" 명령을 실행하여 종속성을 설치합니다.

vuejs에 종속성을 설치하는 방법

이 튜토리얼의 운영 환경: Windows 7 시스템, vue 버전 2.9.6, DELL G3 컴퓨터.

1. 개발 환경

vue 권장 개발 환경:

Node.js: javascript 런타임(런타임), 다양한 시스템에서 직접 다양한 프로그래밍 언어 실행

npm: Nodejs 아래의 패키지 관리자.

webpack: 주요 목적은 리소스 병합 및 패키징과 같이 CommonJS 구문을 통해 브라우저에서 게시해야 하는 모든 정적 리소스를 준비하는 것입니다.

vue-cli: 사용자 생성 Vue 프로젝트 템플릿

2. 환경 설정

node.js 설치:
1. node.js 공식 웹사이트에서 node를 다운로드하고 설치하는 방법은 매우 간단합니다. .
2. npm 버전은 3.0 이상이어야 합니다. 이 버전보다 낮은 경우 업그레이드해야 합니다.

# 查看版本
$ npm -v
2.3.0

#升级 npm
cnpm install npm -g

로그인 후 복사

3. node.js를 기반으로 Taobao npm 미러를 사용하여 관련 종속 항목을 설치합니다. 중국에서는 npm을 사용하면 매우 느리므로 Taobao NPM 미러(http://npm.taobao.org/)를 사용하는 것이 좋습니다.

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

로그인 후 복사

완료 후 npm 대신 cnpm을 사용하여 종속 패키지를 설치할 수 있습니다.

3. vue-cli 스캐폴딩 구성 도구를 설치합니다.

필요한 템플릿 프레임워크를 구축하는 데 도움이 되는 전역 vue-cli 스캐폴딩을 설치합니다.

$ cnpm install -g vue-cli
# 回车，等待安装...
$ vue
# 回车，若出现vue信息说明表示成功

로그인 후 복사

4. vue-cli를 사용하여 프로젝트를 빌드합니다

# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置，默认回车即可
This will install Vue 2.x version of the template.

For Vue 1.x use: vue init webpack#1.0 my-project

? Project name my-project
? Project description A Vue.js project
? Author runoob <test@runoob.com>
? Vue build standalone
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? Yes

   vue-cli · Generated "my-project".

   To get started:

     cd my-project
     npm install
     npm run dev

   Documentation can be found at https://vuejs-templates.github.io/webpack

로그인 후 복사

다섯. cmd

1에 종속성을 설치합니다. cd my-project(프로젝트 이름)를 입력하고 Enter를 누른 후 특정 프로젝트 폴더를 입력합니다.

2). , Enter를 누르고 잠시 기다리세요

cd my-project（项目名），回车，进入到具体项目文件夹

2).输入：cnpm install，回车，等待一小会儿

回到项目文件夹，会发现项目结构里，多了一个node_modules文件夹（该文件里的内容就是之前安装的依赖）

六、测试环境是否搭建成功

方法1：在cmd里输入：npm run dev프로젝트 폴더로 돌아가면 프로젝트 구조에 추가 node_modules 폴더가 있음을 알 수 있습니다(이 파일의 내용은 이전에 설치된 종속성입니다)

6. 테스트 환경 설정 성공 여부

방법 1: cmd에 입력: npm run dev

🎜방법 2: 브라우저에 입력: localhost:8080 (기본 포트는 8080) 🎜🎜관련 추천: "🎜vue.js Tutorial🎜"🎜

위 내용은 vuejs에 종속성을 설치하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!