推荐使用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. [Advance] How to debug a program (上)

    Tool GDB Examining Memory (data or in machine instructions) You can use the command x (for “examine” ...

  2. Ural 1382 2SAT

    ural1382 直接套用 2SAT模板 缩点 拓扑排序... #include<iostream> #include<cstdio> #include<cstdlib& ...

  3. iOS组件化开发入门 —— 提交自己的私有库

    前言:本人也是初次接触组件化开发,感觉现有的资料太繁杂,就简单整理了一下,在此跟大家分享一些入手的经验,主要就是描述cocoapods的私有库封装和提交.组件化开发是个大的议题,涉及到架构思路.设计模 ...

  4. 学生表、课程表、 成绩表 、教师表sql练习

    转自:http://yuncode.net/code/c_58df7a8ca687e58 1.查询“1”课程比“2”课程成绩高的所有学生的学号: SELECT t1.student_id FROM   ...

  5. vs code 快速生成vue 模板

    vs code 快速生成vue 模板 1.使用快捷Ctrl + Shift + P唤出控制台,然后输入snippets并选择.(或 文件>首选项>用户代码片断里面,输入 vue.json ...

  6. easyui-filebox 文件上传

    参考文章:http://blog.csdn.net/fsdad/article/details/73200618 easyui论坛:http://www.jeasyui.com/forum/index ...

  7. ECMA里面的一元符

    只能操作一个值的叫做一元操作符.一元操作符是ECMAScript中最简单的操作符 1.递增和递减操作符 递增和递减操作符直接借鉴自c,而且各有俩个版本,前置型和后置型.顾名思义,前置型就是位于要操作的 ...

  8. 【计蒜客习题】两仪剑法(gcd)

    两仪剑法是武当派武功的高级功夫,且必须 2 个人配合使用威力才大.同时该剑法招数变化太快.太多.设武当弟子甲招数变化周期为 n,武当弟子乙招数变化周期为 m,两弟子同时使用该剑法,当 2 人恰好同时达 ...

  9. 解决前后端分离的“两次请求”引出的Web服务器跨域请求访问问题的解决方案

    在前后端分离的项目中,前端和后端可能是在不同的服务器上,也可以是Docker上,那就意味着前端请求后端Restful接口时,存在跨域情况. 后端在做了通用的跨域资源共享CORS设置后,前端在做ajax ...

  10. OpenSSL 1.0.0生成p12、jks、crt等格式证书的命令个过程

    OpenSSL 1.0.0生成p12.jks.crt等格式证书的命令个过程   此生成的证书可用于浏览器.java.tomcat.c++等.在此备忘!     1.创建根证私钥命令:openssl g ...