您当前的位置: 首页 >  ui

Vue.js学习总结(2)——Vue.js2.X + ElementUI开发环境搭建

科技D人生 发布时间:2017-05-12 18:14:09 ,浏览量:2

一、开发前准备:
Vue项目通常通过webpack工具来构建,而webpack命令的执行是依赖 node.js 的环境的,所以首先要安装node.js 。 (官方地址: https://nodejs.org/en/download/ )
注意: 安装完node之后,npm包含的很多依赖包是部署在国外的,在天朝,大家都知道下载速度是超级慢啊。所以我们要安装cnpm,cnpm是淘宝对npm的镜像服务器,这样依赖的包安装起来就快多了。
安装命令为:npm install -g cnpm -- re registry= https://registry.npm.taobao.org
开发前,请先熟悉下面文档
ES6: http://es6.ruanyifeng.com
Vue.js: https://vuefe.cn/v2/guide/
Element UI : http://element.eleme.io/#/zhCN/component/installation
vuex: https://vuex.vuejs.org/zh-cn/ (数据状态管理)
vue-router: https://router.vuejs.org/zh-cn/ (路由)
axios: https://github.com/mzabriskie/axios ( Ajax框架, 后端请求)
二、根据 官方 指引,构建项目框架(可以将npm改为cnpm)
# 安装vue$ npm install vue@2.1.6# 全局安装 vue-cli$ npm install --global vue-cli# 创建一个基于 webpack 模板的新项目my-project$ vue init webpack my-project# 进入项目目录
$ cd my-project# 安装依赖$ npm install# 运行项目$ npm run dev
三、项目环境搭建成功
四、安装element-ui
npm i element-ui -S
#也可以直接指定elemengt-ui的版本
$ npm i element-ui@1.3.92
五、在main.js引入element-ui
import Element from 'element-ui' import 'element-ui/lib/theme-default/index.css' Vue.use(Element)
六、创建项目目录,开发自己的项目页面
关注
打赏
1688896170
查看更多评论

科技D人生

暂无认证

  • 2浏览

    0关注

    1542博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文
立即登录/注册

微信扫码登录

0.1653s