vue全家桶进阶之路6：Vue的安装以及js引入

1、安装

　　注意：Vue 不支持 IE8 及以下版本

　　创建一个文件夹用于下载引入Vue

　　D:\BaiduSyncdisk\vue2

　　按照最新版本的Vue

　　npm install vue

　　

　　

　　创建完成后便可以在node_modules\vue\dist查看Vue的js文件：D:\BaiduSyncdisk\vue1\node_modules\vue\dist

　　vue2

　　

　　vue3

　　 

2、引入

　　下载js文件本地引入　　　　

　　即：从官网下载js文件，然后在程序中引用路径，一般情况下，项目会有一个专门的文件夹存放js文件，所以Vue的js文件也存放至此即可。　

　　开发模式：https://v2.cn.vuejs.org/js/vue.js

　　生产模式：　https://v2.cn.vuejs.org/js/vue.min.js

　　引用方式：

vue2
<script src="js/vue.js"></script>
vue3
<script src="js/vue.global.js"></script>

　　通过CDN使用Vue

　　这是一种很方便的Vue使用方法，和很多JavaScript组件的引用方式相同，直接在代码中引入

vue2
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.10"></script>

vue3
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>

安装CLI脚手架

　　　　　　npm install -g @vue/cli

npm install vue -g 安装vue.js
npm install webpack -g 安装webpack模板
npm install --global webpack-cli 安装webpack-cli
npm install -g vue-cli 安装vue-cli

使用webpack -v 和 vue -V 检查是否安装成功（注意vue -V 大写）

　　　　下载地址：https://cli.vuejs.org/zh/

　　官方文档说明

npm install -g @vue/cli # 原生npm的下载速度太慢，各种报错。因此，使用淘宝镜像来安装
npm install -g @vue/cli --registry=https://registry.npm.taobao.org 
# OR
yarn global add @vue/cli

　　安装完成

D:\vue3\st02>vue -V
@vue/cli 5.0.8
创建项目：

vue create 项目名称
例如：vue create my-project
运行项目：
首相用开发工具打开项目
然后运行：

npm run serve