>웹 프론트엔드 >View.js >vuejs3 설치 방법

vuejs3 설치 방법

藏色散人
藏色散人원래의
2021-09-02 15:39:343929검색

vuejs3 설치 방법: 1. Vue.js 공식 웹사이트에서 직접 새 버전을 다운로드하고 <script> 태그로 소개합니다. 2. CDN 방식을 사용하여 vuejs를 설치합니다. vuejs를 설치하세요. </script>

vuejs3 설치 방법

이 기사의 운영 환경: windows7 시스템, vuejs3 버전, DELL G3 컴퓨터.

vuejs3을 어떻게 설치하나요?

Vue3 설치

1. 독립 버전

Vue.js 공식 홈페이지에서 직접 최신 버전을 다운로드하여 <script> 태그로 소개할 수 있습니다. </script>

Vue.js 다운로드: https://unpkg.com/vue@3.2.7/dist/vue.global.js

2. CDN 방식을 사용하세요

다음은 비교적 안정적인 외국 CDN 두 가지를 추천합니다. , 중국에서 더 좋은 것을 찾지 못했지만 여전히 로컬에서 다운로드하는 것이 좋습니다.

Staticfile CDN(국내): https://cdn.staticfile.org/vue/3.0.5/vue.global.js

unpkg: https://unpkg.com/vue@next, npm을 통해 계속 게시됩니다. 최신 버전은 일관성이 있습니다.

cdnjs: https://cdnjs.cloudflare.com/ajax/libs/vue/3.0.5/vue.global.js

Staticfile CDN (국내)

<div id="app">
  <p>{{ message }}</p>
</div>

unpkg (권장)

<div id="app">
  <p>{{ message }}</p>
</div>

cdnjs

<div id="app">
  <p>{{ message }}</p>
</div>

3. NPM 방법

npm의 느린 설치 속도로 인해 이 튜토리얼에서는 Taobao의 이미지와 해당 명령 cnpm을 사용합니다. 설치 및 사용 지침은 Taobao NPM 이미지 사용을 참조하세요.

npm 버전은 3.0 이상이어야 합니다. 이 버전보다 낮은 경우 업그레이드해야 합니다.

# 查看版本
$ npm -v
2.3.0
#升级 npm
cnpm install npm -g
# 升级或安装 cnpm
npm install cnpm -g

Vue.js로 대규모 애플리케이션을 구축할 때는 cnpm 설치를 사용하는 것이 좋습니다. Webpack 또는 Browserify 모듈 패키저 사용:

# 最新稳定版
$ cnpm install vue@next

명령줄 도구

Vue.js는 대규모 단일 페이지 애플리케이션을 빠르게 구축하는 데 사용할 수 있는 공식 명령줄 도구를 제공합니다.

# 全局安装 vue-cli
$ cnpm install -g @vue/cli
# 安装完后查看版本
$ vue --version
@vue/cli 4.5.11

참고: vue-cli 3.x와 vue-cli 2.x는 동일한 vue 명령을 사용합니다. 이전에 vue-cli 2.x를 설치한 경우 Vue-cli 3.x로 대체됩니다.

@vue/cli-int 설치:

$ cnpm i -g @vue/cli-init

프로젝트 생성

$ vue init webpack runoob-vue3-test
# 这里需要进行一些配置,默认回车即可
? Project name runoob-vue3-test
? Project description A Vue.js project
? Author runoob <test@runoob.com>
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner jest
? Setup e2e tests with Nightwatch? Yes
? Should we run `npm install` for you after the project has been created? (recommended) npm
   vue-cli · Generated "runoob-vue3-test".
# Installing project dependencies ...
# ========================
...

프로젝트 입력, 설치 및 실행:

$ cd runoob-vue3-test
$ cnpm run dev
  DONE  Compiled successfully in 2558ms          
 I  Your application is running here: http://localhost:8080

위 명령을 성공적으로 실행한 후 http://localhost:8080/을 방문하면 출력 결과가 나타납니다.

vuejs3 설치 방법

참고: Vue.js는 IE8 이하 IE 버전을 지원하지 않습니다.

관련 추천: "vue.js 튜토리얼" "5개의 vue.js 비디오 튜토리얼 중 최신 선택"

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

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사:Vue 비계 설치 단계다음 기사:Vue 비계 설치 단계