webpack+vue+elementui构建后台管理系统

1、使用vue-cli构建骨架

a： 全局安装vue-cli npm install --global vue-cli

b：使用命令创建项目  vue  init webpack you_project_name

c : 加载模块  npm install或  cnpm  install(淘宝镜像安装)

参考资料:http://www.jianshu.com/p/2769efeaa10a

2、安装css style loader(css文件可以作为模块导入)

cnpm install css-loader style-loader --save-dev

3、安装elementui

npm i element-ui -S

importVuefrom'vue'

importElementUIfrom'element-ui'

import'element-ui/lib/theme-chalk/index.css'

importAppfrom'./App.vue'

Vue.use(Element, { size:'small' })

4、启动项目

启动生成模式临时服务器  npm start

编译:  npm  run  build

5、建立项目的骨架

6、参考文档

a:nodejs npm基础学习  (http://www.runoob.com/nodejs/nodejs-tutorial.html)

b：webpack学习（http://www.jianshu.com/p/42e11515c10f）

c:  vue学习（https://cn.vuejs.org/v2/guide/events.html）

d:  vue-router学习（https://router.vuejs.org/zh-cn/installation.html）

e:  基于vue-cli快速构建(http://www.jianshu.com/p/2769efeaa10a)

f: element ui 前端桌面框架（http://element-cn.eleme.io/#/zh-CN/component/quickstart）

g:  vue-axios中文说明  进行数据请求（https://www.kancloud.cn/yunye/axios/234845）

h: vue-scroller 上拉加载下拉刷新插件

i:   引入jquery （https://segmentfault.com/a/1190000007020623）

j:https://shop136014658.taobao.com/