Element-UI 是饿了么前端团队退出了一套基于 vue.js 开发的 UI 组件库,在与 Vue-cli 创建的项目结合时,需要做以下配置:

1. 安装 loader 模块

cnpm install style-loader -D
cnpm install css-loader -D
cnpm install file-loader -D

2. 安装 Element-UI 模块

cnpm install element-ui -S

3. 修改 webpack.base.conf.js 的配置

{
test: /\.css$/,
loader: ‘style!css‘
},
{
test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
loader: ‘file‘,
query: {
limit: 10000,
name: utils.assetsPath(‘fonts/[name].[hash:7].[ext]‘)
}
}

4. 在 main.js 中引入

import ElementUI from ‘element-ui‘
import ‘element-ui/lib/theme-default/index.css‘
Vue.use(ElementUI)

配置完成后,就可以直接使用 Element-UI 封装的组件了

在 Vue-cli 创建的项目中引入 Element-UI的更多相关文章

  1. 【vue】如何在 Vue-cli 创建的项目中引入 iView

    根据vue项目的搭建教程,以下记录如何在Vue-cli创建的项目中引入iView. 1)iView的安装,在项目下使用 npm 安装iView cnpm install  iview  --save ...

  2. 【vue】如何在 Vue-cli 创建的项目中引入iView

    根据vue项目的搭建教程,一下记录下如何在Vue-cli创建的项目中引入iView. 1)安装iView,在项目下 cnpm install  iview  --save 2 ) 在 webpack ...

  3. vue cli创建typescript项目

    使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...

  4. vue-cli创建的项目中引入第三方库报错 'caller', 'calle', and 'arguments' properties may not be...

    http://blog.csdn.net/sophie_u/article/details/76223978 以在vue中引入mui第三方库为例: 虽然针对vue,有单独的vue-mui库可以使用,但 ...

  5. vue-cli创建的项目中引入第三方库报错'caller', 'calle', and 'arguments' properties may not be...

    本文链接:https://blog.csdn.net/Sophie_U/article/details/76223978 问题: 在vue的main.js中引入mui.min.js时,报错. 如上,单 ...

  6. vue cli创建的项目 当你后期使用了ES6语法,如何解决浏览器兼容问题

    最近开发了一个项目,开发过程中,由于需要使用了async await ,于是发现,只有少数的浏览器支持,极大多数的浏览器是不支持这玩意的,在网上各种找解决方案,基本都是失败,最后总结了两个方案之后,尝 ...

  7. 在Vue项目中使用Element UI:按需引入和完整引入

    下面操作在main.js文件中进行 完整引入: import Element from 'element-ui'; //样式文件,需单独引入 import 'element-ui/lib/theme- ...

  8. vue cli3 创建的项目中eslint 配置 问题的解决

    1--   vue cli3 项目文件结构 2-- 注释问题 在eslintrc.js 文件中,将 '@vue/standard' 注释后重启即可: 3-- 配置 eslint 文件 在 vue-cl ...

  9. php项目中使用element.ui和vue

    1.plugins中添加axios,element-ui 2.全局文件下引入 <script src="/static/plugins/vue@2.5.13/vue.js"& ...

随机推荐

  1. JavaScript img标签自带的onload和onerror函数

    onload 加载完成时调用触发 原生: <img src="" alt="Park" onload=“handleImageLoaded()”/> ...

  2. jdk13快来了,jdk8的这几点应该看看!

    说明 jdk8虽然出现很久了,但是可能我们还是有很多人并不太熟悉,本文主要就是介绍说明一些jdk8相关的内容. 主要会讲解: lambda表达式 方法引用 默认方法 Stream 用Optional取 ...

  3. Badboy参数化 - Add Variable(循环使用不同的关键字进行搜索)

    参考: http://leafwf.blog.51cto.com/872759/1113716 http://www.51testing.com/html/00/130600-1367743.html ...

  4. lightoj 1119 - Pimp My Ride(状压dp)

    题目链接:http://www.lightoj.com/volume_showproblem.php?problem=1119 题解:状压dp存一下车有没有被搞过的状态就行. #include < ...

  5. WEB-UI自动化测试实践

    一.设计背景 随着IT行业的发展,产品愈渐复杂,web端业务及流程更加繁琐,目前UI测试仅是针对单一页面,操作量大.为了满足多页面功能及流程的需求及节省工时,设计了这款UI 自动化测试程序.旨在提供接 ...

  6. CM & CDH 基本概念

    什么是 CDH Hadoop 是开源项目,所以很多公司在这个基础上进行商业化,不收费的 Hadoop 主要有三个: Apache,最原始的版本,所有发行版均基于这个版本进行 Cloudear,全称 C ...

  7. 为什么医疗行业需要API市场?

    医疗健康行业无论在国内外都是采用先进技术的先驱者之一,原因在于业内的利益相关者会更加接近数据.重视数据的重要性,从而加快在决策上面的动作,以期更好的患者的预期寿命和增进社会人口的健康.更重要的是,数据 ...

  8. 【JavaWeb】Servlet3.0中注解驱动开发

    一.概述 二.@WebServlet注解 三.共享库/运行时插件 2.1 注册Servlet 2.2 注册监听器 2.3 注册过滤器 一.概述 Servlet3.0中引入了注解开发 二.@WebSer ...

  9. LeetCode go

    用Go语言刷LeetCode记录,只是为了练习Go语言,能力有限不保证都是最优解,只能在此抛转引玉了. 数据结构和算法 数据结构和算法是程序员的命根子,没了命根子也就没有了尊严. 1. 两数之和 题目 ...

  10. TestNG(十二) 参数化测试

    <?xml version="1.0" encoding="utf-8" ?> <suite name = "parameter&q ...