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. ssh三大框架的认识

    一.SSH三大框架的概述 ssh为 struts+spring+hibernate的一个集成框架,是目前较流行的一种Web应用程序开源框架.  集成SSH框架的系统从职责上分为四层:表示层.业务逻辑层 ...

  2. Apache JMeter HTTPS(S) Test Script Recorder

    参考Apache官网资料:http://jmeter.apache.org/usermanual/jmeter_proxy_step_by_step.pdf 1. 进入apache-jmeter-2. ...

  3. HDU2874 Connections between cities 最近公共祖先

    第一次按常规的方法求,将所有的查询的u,v,和最近公共祖先都保存起来,然后用tarjan+并查集求最近公共祖先.因为询问的次数过多,所以在保存查询的时候总是MLE,后来参考了一下别人的代码,才突然觉悟 ...

  4. 背包形动态规划 fjutoj1380 Piggy-Bank

    Piggy-Bank TimeLimit: 2000/1000 MS (Java/Others)  MemoryLimit: 65536/32768 K (Java/Others) 64-bit in ...

  5. Linux运维基础提高之RAID卡和磁盘分区

    磁盘大小计算: 柱面的数量*每个柱面的大小(容量) [root@luffy001 ~]# fdisk -l Disk /dev/sda: 10.7 GB, 10737418240 bytes 255 ...

  6. linux ubuntu 18首次使用root权限

    第一次获得root密码: sudo passwd root 切换成root用户,获得root权限 exit 退出,回到初始用户

  7. 新手学习FFmpeg - 调用API调整视频局部速率

    通过修改setpts代码实现调整视频部分的播放速率. 完整代码可参考: https://andy-zhangtao.github.io/ffmpeg-examples/ 在前面提到了PTS/DTS/T ...

  8. 用101000张食物图片实现图像识别(数据的获取与处理)-python-tensorflow框架

    前段时间,日剧<轮到你了>大火,作为程序员的我,看到了另外一个程序员—二阶堂,他的生活作息,以及饮食规律,让我感同身受,最让我感触的是他做的AI聊天机器人,AI菜品分析机器人,AI罪犯分析 ...

  9. STL中区间最值max_element和min_element的用法

    前面的博客已经讲解了nth_element寻找区间第K大的用法,现在我们来说说这两个找区间最值的用法.两个函数都包含在algorithm库中. 一.函数原型 max_element template& ...

  10. JWT简明介绍

    JSON Web Token一种数据格式,用来表示Token.具有可扩展.防篡改.能够在URL中安全传输的特性,已经形成标准,定义在rfc7519. JSON Web Token (JWT) is a ...