Vue ElementUI 按需引入
一.element UI组件的单独使用(第一种方法):
1、cnpm install babel-plugin-component -D
2、找到.babelrc 配置文件
把
{
"presets": [
["env", { "modules": false }],
"stage-3"
]
}
改为 注意:
{
"presets": [["env", { "modules": false }]],
"plugins": [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
}
3、
import { Button, Select } from 'element-ui';
Vue.use(Button)
Vue.use(Select)
二.element UI组件的单独使用(第二种方法):
import { Button, Select } from 'element-ui';
Vue.use(Button)
Vue.use(Select)
引入对应的css
import 'element-ui/lib/theme-chalk/index.css';
如果报错: webpack.config.js 配置file_loader
{
test: /\.(eot|svg|ttf|woff|woff2)(\?\S*)?$/,
loader: 'file-loader'
}
Vue ElementUI 按需引入的更多相关文章
- vue+elementui按需引入
转载自以下网址,仅作备忘之用:https://www.cnblogs.com/lwj820876312/p/9169457.html 基于Vue的Ui框架 饿了么公司基于vue开的的vue的Ui组件库 ...
- element-ui按需引入
{ "name": "vue-test2", "description": "A Vue.js project", &q ...
- vue中按需引入Element-ui
安装 1.安装element-ui:npm i element-ui -S. 2.安装babel-plugin-component:npm install babel-plugin-component ...
- 从element-ui按需引入去探索
element-ui的按需引入的配置:文档地址 npm install babel-plugin-component -D { "presets": [["es2015& ...
- 解决element-ui按需引入不了Scrollbar的问题
一.报错原因 在我想按需引入element-ui时,突然报错: 这个报错来的有点措不及防.明明在页面当中能够使用,为仕么在单独引入时却不能引用了,真是百思不得其解. 经过在百度上的查找才知道,原来Sc ...
- vue Cli 按需引入Element UI 和全局引用Element UI
全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-u ...
- ElementUI 按需引入坑爹的点记录
官网说的是这样的: 但实际上,应该是这样修改: { "presets": [ ["env", { "targets": { "br ...
- vue中按需引入mint-UI报Error: .plugins[3][1] must be an object, false, or undefined
{ "presets": ["@babel/preset-env", "@babel/preset-react"], "plugi ...
- 在Vue项目中使用Element UI:按需引入和完整引入
下面操作在main.js文件中进行 完整引入: import Element from 'element-ui'; //样式文件,需单独引入 import 'element-ui/lib/theme- ...
随机推荐
- 数字特征值-python
#Digital eigenvalue.py number = eval(input()) count = 0 Ob = 0 Ox = 0 while number > 0: Ob = numb ...
- 尝鲜svnup
最近有同事折腾了一下svnup的编译,终于可以在Mac OS X和Linux上面编译通过了,仓库在这里:https://github.com/lvzixun/svnup/ svnup这个工具只有一个功 ...
- 信号量及P/V操作
有一个厕所,允许多个男生同时使用,也允许一个女生使用,但是不允许男女共用(那岂不是乱了套)通过厕所门口有一个三面小牌子来运行.一面是男生在用,第二面是女生在用,第三面是空.运行机制:第一个进入空厕所男 ...
- 当Django中Debug=False,静态文件处理方式。
Django设置DEBUG为False时,'django.contrib.staticfiles'会关闭,即Django不会自动搜索静态文件,静态文件不能加载导致的问题有两个: 1.页面排版不正常,即 ...
- Dart 的function
方法的定义 返回类型 方法名 (参数1 ,参数2 ,...){ 方法体 返回值 } => 的使用
- Nginx在CentOS7下的安装
一,安装前的准备(Nginx安装之前,需要的工具以及依赖包:wget.gcc.pcre.openssl.zlib ) 1,wget安装 yum -y install wget 2,gcc安装 yum ...
- LeetCode 136. Single Number C++ 结题报告
136. Single Number -- Easy 解答 相同的数,XOR 等于 0,所以,将所有的数字 XOR 就可以得到只出现一次的数 class Solution { public: int ...
- 文件IO 相关的包:java.io文件——API
文件IO 相关的包:java.io文件——API 1.Java.io.File类的使用(1)两种路径绝对路径:相对于当前路径:当前为 “工程名”(2)File类创建,对象为一个文件/目录,可能存在或不 ...
- C# 关于变量使用范围容易犯错的问题(TreeView数据绑定为例)
asp.net做一个treeview数据绑定 绑定子节点时查询出来的数据正确,但在进行数据绑定时一直索引溢出 然后调试 ... 调试 ... 再调试... 依然很崩溃 想到了是变量定义后面共用后的问 ...
- django使用ckeditor上传图片
1.在模型类中设置字段为富文本类型,这里需要注意引入的是RichTextUploadingField,以允许上传图片,需要和RichTextField区分开 from ckeditor_uploade ...