使用vue开发后台管理系统详细步骤

使用vue开发后台管理系统详细步骤

1## 前期准备
浏览器插件
Vue.js devtools
VS Code插件
自动补全标签
Auto Close Tag
Auto Complete Tag
Auto Rename Tag

开启一个服务器浏览HTML网页，第一次使用需要Ctrl + Shift + p输入 live server选择open
Live Server

路径自动补全
Path Intellisense

vue语法高亮和自动补全代码
Vetur
VueHelper

Vs Code设置
文件—>首选项—>设置，然后添加如下代码：

“emmet.syntaxProfiles”: {
“vue-html”: “html”,
“vue”: “html”
},
“emmet.includeLanguages”: {
“vue-html”: “html”,
“vue”: “html”
}

开始项目

vue-cli是官方的一个脚手架工具，所谓脚手架呢就是一个架子，什么架子呢？项目结构的架子，里面有一些最基本的结构配置。利用vue-cli呢，我们可以生成这样的一个脚手架，所以呢它就被称为vue脚手架工具。

npm install [email protected] -g 下载工具

vue init webpack admin 通过上面的工具下载模板，此处的admin为项目名称

element-ui
安装：npm i element-ui -S