【Vue.js】- Vue.js的安装

1.独立版本

在官网上下载vue.min.js,并用<script>标签引入。

<script src="./vue.min.js/vue.min.js"></script>

下载Vue.js

2.使用CDN方法

国内:BootCDN: https://cdn.bootcss.com/vue/2.2.2/vue.min.js

国外:unpkj:https://unpkg.com/vue/dist/vue.js 会和npm发布的最新版本一致。

国外:cdnjs:https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.8/vue.min.js

使用CDN方法稳定性不如直接下载到本地。

3.npm方法

npm安装比较慢,我们可以使用淘宝镜像以及其命令cnpm

npm 版本需要大于 3.0,如果低于此版本需要升级它:

查看版本:npm -v

【Vue.js】- Vue.js的安装

如果版本小于3.0需要升级:

cnpm install npm -g

3.1安装淘宝npm镜像:

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

【Vue.js】- Vue.js的安装

3.2安装webApp

cnpm install webpack -g

【Vue.js】- Vue.js的安装

3.3 安装vue脚手架

npm install vue-cli -g

【Vue.js】- Vue.js的安装

3.4 创建一个文件,并进入该目录

我们在D盘D:\Vue.js\demo中根据模板创建项目

【Vue.js】- Vue.js的安装

创建项目

【Vue.js】- Vue.js的安装

cd 进入创建的项目中

cd helloDemo

3.5 安装项目依赖

一定要从官方仓库安装,npm 服务器在国外所以这一步安装速度会很慢

npm install

【Vue.js】- Vue.js的安装

不要从国内镜像cnpm install中安装,会导致后面缺少依赖的库

3.6安装 vue 路由模块vue-router和网络请求模块vue-resource

cnpm install vue-router vue-resource --save

【Vue.js】- Vue.js的安装

3.7 启动项目

npm run dev

【Vue.js】- Vue.js的安装

3.8 效果

【Vue.js】- Vue.js的安装