今天学了一个基于Vue2.0的桌面端组件库Element,号称是全世界最流行的Vue UI框架。感觉学会了之后就变身大牛了有木有。
好了,不吹牛皮了。
Element官方文档通俗易懂,框架什么的安装引入就是干,管他是什么,咱先整一个import(哈哈哈),所以这一系列博客可能只是记录学习过程中遇到的各种问题及解决方案,Let's to be a dalao!
1.首先是安装
官方首推npm的方式安装,因为可以更好的配合webpack打包工具
npm i element-ui -S
/* -S大写,是--save的缩写,对于上线后运行仍需要依赖的插件要使用--save,例如:webpack axios vant Element UI框架等等,而只是帮助开发的插件,只需-D即可,是--save-dev的缩写,例如:babel live-server loader等等,这是简单理解,深入了解可以去研读相关文档。 */
因为是零基础来的,所以遇到的问题会很多,比如npm安装失败(囧)百度了一下,因为NPM安装插件过程:从http://registry.npmjs.org 下载对应的插件包(该网站服务器位于国外,所以经常下载缓慢或出现异常),所以推荐不行的时候使用cnpm来安装插件,此方法同样适用于其他插件=。=
安装之前咱们先清一下缓存,不是很懂这一块,但是用了好像就解决安装报错的问题了,然后安装cnpm,最后使用cnpm来安装咱们的Element UI就可以啦(#号之后为注释,不要带上)
npm cache clean -f #清缓存
npm install -g cnpm --registry=https://registry.npm.taobao.org #安装cnpm
cnpm install element-ui -S #安装element-ui插件
2.安装完了接下来就是引用啦
支持整体引用和部分引用:
完整引入只需在main.js中输入如下代码:
import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.use(ElementUI) new Vue({ el:'#app', render: h => h(App) });