权限管理系统--前端篇（一）搭建前端开发环境

1、技术基础
（1）vue2.0：优秀的MVVM设计模式下的JS框架；
（2）vue-router：vue.js路由管理模块；
（3）vuex：vue.js状态管理模块；
（4）ElementUI：饿了么提供的基于Vue.js的UI框架；
2、前端环境安装
NodeJS（npm自带）
Visual Studio Code（轻量级前端IDE）
（1）检查环境：
npm -v
（2）升级旧版本的npm：
sudo npm install npm -g #linux
npm install npm -g　　# windows
（3）安装webpack
npm install webpack -g
（4）安装vue-cli（安装 vue 脚手架项目初始化工具 vue-cli，-g 表示全局安装）
npm install vue-cli -g
（5）npm中央仓库换成国内的淘宝镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org
（6）创建项目
vue init webpack kiven-ui
一路根据提示输入项目信息，等待项目生成。

选择自己手工安装依赖，结果如下：

进入项目，执行如下命令完成依赖包的安装，依赖包都是在项目的node_modules文件夹下。

cnpm install element-ui font-awesome js-cookie mockjs vue-i18n vuex axios sass-loader node-sass --save-dev
（7）运行项目
npm run dev
命令执行之后，如果显示 “I Your application is runing here ....”，就表示启动成功了。
（8）访问项目
浏览器访问对应地址，例如: http://localhost:8080，会出现 vue 的介绍页面。
到此，我们的项目脚手架就建立起来了。

转载于:https://www.cnblogs.com/Kiven-zhou/p/10359271.html