推荐使用npm安装

1.安装:npm install element-ui -S

2.整体引入:

  在你项目的main.js中写入:

  import ElementUI from 'element-ui'

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

  Vue.use(ElementUI)

3.可以仅引入你需要的部分

  这里需要借助:babel-plugin-component

  所以我们要先安装:babel-plugin-component

  npm install babel-plugin-component -D

  然后修改.babelrc

  在env的test中增加"libraryName": ["element-ui"],这项配置

  

  然后你就可以向下面这样,单独使用部分组件啦

  import { Button, Select } from 'element-ui'//这里我们仅引用了Button, Select这两个组件

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

  Vue.use(Button)

  Vue.use(Select)

5.到此我们就可以使用element-ui来进行我们的vue项目开发了

在vue项目中快速使用element UI的更多相关文章

  1. vue入坑教程(二)在vue项目中如何导入element以及sass

    在项目中导入element以及sass.stylus等方便开发的工具以及UI框架 (1)如何在vue项目中导入elementUI框架 elementUI是饿了么团队开发出来基于vue的前端UI框架,其 ...

  2. 在vue2.x项目中怎么引入Element UI

    参考:https://blog.csdn.net/u014054437/article/details/79862793 Element使用方法:https://element.eleme.cn/#/ ...

  3. vue中的swiper element ui

    欢迎加入前端交流群交流知识&&获取视频资料:749539640 很多同学问,怎么把swiper引入到vue的脚手架里去,之前的一篇博客有提到怎么引入,但是后来感觉不怎么好,还是用一些v ...

  4. 在vue项目中使用canvas-nest.js,报parameter 1 is not of type 'Element'

    canvas-nest.js是一款轻量的网页特效,如图: github地址:https://github.com/hustcc/canvas-nest.js 在普通的html项目中,只要将<sc ...

  5. 如何在Vue项目中,通过点击DOM自动定位VScode中的代码行?

    作者:vivo 互联网大前端团队- Youchen 一.背景 现在大型的 Vue项目基本上都是多人协作开发,并且随着版本的迭代,Vue 项目中的组件数也会越来越多,如果此时让你负责不熟悉的页面功能开发 ...

  6. vue 项目中实用的小技巧

    # 在Vue 项目中引入Bootstrap 有时在vue项目中会根据需求引入Bootstrap,而Bootstrap又是依赖于jQuery的,在使用npm按照时,可能会出现一系列的错误 1.安装jQu ...

  7. Vue项目中如何使用Element-UI以及如何使用sass

    Vue项目中如何使用Element-UI以及如何使用sass 当我们在开发Vue项目的时候通常会选择Element-UI作为我们的UI框架,其官方中文文档地址是http://element.eleme ...

  8. Castle Windsor 项目中快速使用

    Castle Windsor 项目中快速使用 新建项目如下: 一个模型类,一个接口,一个实现方法.我的目的很明确就是在UI层通过Castle 调用数据访问层的方法. 添加项目引用 CastleDemo ...

  9. 如何在Vue项目中使用Typescript

    0.前言 本快速入门指南将会教你如何在Vue项目中使用TypeScript进行开发.本指南非常灵活,它可以将TypeScript集成到现有的Vue项目中任何一个阶段. 1.初始化项目 首先,创建一个新 ...

随机推荐

  1. Excel设定编辑列权限的方法

    工具---保护--允许用户编辑区域 --新建-- 选择(或输入)引用单元格 ,区域密码:对不同的人不同的区域用不同的密码,设置完成后,保护工作表(密码用管理员的),即可

  2. SqlServer数据库性能优化详解

    数据库性能优化详解 性能调节的目的是通过将网络流通.磁盘 I/O 和 CPU 时间减到最小,使每个查询的响应时间最短并最大限度地提高整个数据库服务器的吞吐量.为达到此目的,需要了解应用程序的需求和数据 ...

  3. Shell脚本下条件测试(eq.ne.....)(转载)

    转载:http://cxj632840815.blog.51cto.com/3511863/1168709 Shell编程中的条件测试 在Linux编程中经常会用到判断数值的大小,字符串是否为空这样或 ...

  4. 堆和栈的区别【以java为例潜入分析】

     Java的堆是一个运行时数据区,类的对象从中分配空间,这些对象通过new等指令建立. 堆是由垃圾回收来负责的,堆的优势是可以动态地分配内存大小,生存期也不必事先告诉编译器,Java的垃圾收集器会自动 ...

  5. P3207 [HNOI2010]物品调度

    传送门 完了题目看错了--还以为所有的\(x,y\)都要一样--结果题解都没看懂-- 先考虑如果已经求出了所有的\(pos\)要怎么办,那么我们可以把\(0\)也看做是一个箱子,然后最后每个箱子都在一 ...

  6. 微信小程序获取自定义属性值

    写小程序的时候用到了自定义属性,特地来记录一下 特别是这个坑,必须得说一说 wxml <view class='box' bindtap='getValue'> <view clas ...

  7. StackOverflow 创始人关于如何高效编程的清单

    这是 StackOverflow 联合创始人 Jeff Atwood 注释的十戒.程序员普遍有很强的自尊心,都应该看看本文,打印下来时刻提醒自己. “无我编程”发生在开发阶段,表现为技术团队经常通过同 ...

  8. spring Cache /Redis 缓存 + Spring 的集成示例

    spring Cache https://www.ibm.com/developerworks/cn/opensource/os-cn-spring-cache/ spring+redis 缓存 ht ...

  9. [C和指针] 1-快速上手、2-基本概念、3-数据

    第1章 快速上手 1.1.1 空白和注释   程序的空白的作用: 空行将程序的不同部分分割开来:制表符缩进语句,可以更好地显示程序的结构等等.     软件最大的开销并非在于编写,而是在于维护,所以需 ...

  10. web api 二

    接着上一回说,上回说到,web api有几种访问方式,具体有几种,我还真没去研究过,但是这里打算从get.post.put.delete四种请求方式分别谈谈基础类型(包括int/string/date ...