1.下载并安装Node.js
下载地址：https://nodejs.org/en/download/
下载node-v12.16.1-x64.msi
2.在cmd中查看node.js是否安装成功，以及是否安装npm
node -v
npm -v
3.安装vue的脚手架工具（vue项目前期项目目录结构的工具）
npm config set registry https://registry.npm.taobao.org
npm config get registry
npm install -g @vue/cli
npm install -g @vue/cli-init
npm install -g webpack@3.12.0
npm install webpack@3.12.0 -D
npm install -g webpack-dev-server@2.11.2
npm install webpack-dev-server@2.11.2 -D
通过vue --version验证
查看安装目录 C:\Users\liw66\AppData\Roaming\npm
4.在cmd中使用webpack创建一个vue项目
#进入到项目目录
cd D:\project\vue
#创建项目
vue init webpack 项目名称
之后会出现对话提示。单元测试和e2e测试选n，其他选择回车，安装完成
5.运行第一个Vue网站
在cmd中输入以下命令
cd 项目名称
npm run dev
打开http//:localhost:8080就可以访问
在config/index.js里面修改端口号
6.如何使用编辑工具打开网站
下载 Visual Studio Code
在vsCode中打开项目文件路径
7.vscode设置自动保存，Settings搜索
files.autoSave将off改为onFocusChange
失去焦点自动保存
8.安装element-ui
npm i element-ui -S
在src/main.js中加入
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
在vue文件里加入
<el-button type="primary">主要按钮</el-button>
9.Vue语法
文本
数据绑定使用 {{...}}
Html
使用 v-html 指令输出 html 代码
属性
HTML 属性使用 v-bind 指令
指令
指令是带有 v- 前缀的特殊属性。
v-if v-else v-else-if 条件判断
v-for 循环
v-on 事件监听
v-model 双向数据绑定
