Vue 全家桶搭建后台管理系统（1、搭建项目）

准备工做

该项目是使用 Vue 官方提供的 vue-cli 这个构建工具，大大下降了咱们使用webpack来配置项目的难度。
一、该项目要基于node环境，因此咱们要去官网下载安装（具体再也不赘述）；
二、安装npm，通常安装最新版node的时候就会安装好npm。

开始搭建

1、全局安装 vue-cli，输入下面的命令：npm install -g vue-cli

2、建立一个基于 webpack 模板的新项目 myProject（项目名可本身定义），输入命令：vue init webpack myProject

接下来通常都按 enter 键便可，但要注意如下两点：

一、项目名称：项目名不能包含大写字母，myProject中包含大写字母，因此须要修改。

二、ESLint 即代码规范，这个直接选 Y 的话，代码写得不规范会报错，新手很蛋疼，因此能够选 n。

三、项目建立成功

3、进入建立的项目文件夹：cd myProject

4、启动本地服务器：npm run dev

一、在浏览器中打开图中地址：

二、能够看到项目搭建成功！

5、接下来安装咱们须要的插件依赖包

一、安装 element-ui（基于vue的UI框架)： npm i element-ui -S，而后在 main.js 中写入黑体部分，修改成如下内容：

import Vue from 'vue'
import App from './App'
import router from './router'
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
Vue.config.productionTip = false
new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})

二、安装 axios (AJAX与后台交互数据)
npm install axios -s
三、安装 vuex（基于vue的状态管理模式）
npm install vuex -S
四、安装 echarts（图表显示）
npm install echarts --save

6、偷懒借菜鸟教程的说明，注释下咱们的项目目录