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- ...
随机推荐
- SQL函数语句
MyBatis实现模糊查询 1.${-}代替#{-} 2.把'%#{name}%'改为"%"#{name}"%" 3.使用sql中的字符串拼接函数 4.使用标签 ...
- c#图片裁剪
c#文件裁剪 Bitmap newbm = new Bitmap(nowWidth, nowHeight); Graphics g = Graphics.FromImage(newbm); g.Int ...
- Python学习笔记,day4
Python学习第四天 一.装饰器 函数调用顺序: 其他高级语言类似,Python 不允许在函数未声明之前,对其进行引用或者调用 高阶函数: 满足下列条件之一就可成函数为高阶函数 某一函数当做参数传入 ...
- JavaScript线程(第八天)
js是单线程的: js中的线程分为三种 1.页面渲染 2.主代码逻辑 3.事件触发: 下面我们来看一段代码 <script> setTimeout(function(){ conso ...
- Scala基础
1.seq[String] 用[]表示参数类型,java使用<>表示参数,因为Scala 允许以<命名方法和变量名,java不允许 2.支持range的类型:Char .Int . ...
- ubuntu常见问题解决方法
系统版本:ubuntu 18.04 lts 电脑:拯救者y7000 1.开机卡屏 无法进如 这可能是没安装英伟达显卡驱动,在grub 界面在 splash 后面添加 nomodeset 即可进入桌面 ...
- python 集成cython 简单测试
实际开发中我们可能需要集成c/c++ 编写的模块,我们可以通过cython 解决类似的问题 以下测试一个简单的c add 方法, 使用venv 同时构建为一个pip 包 环境准备 venv 初始化 ...
- dispatherServlet拦截所有请求,但是不拦截JSP和其他配置的servelt
不是顺序问题,是就不拦截Servlet 不是load-on-startup启动先后顺序问题,是就是不拦截Servlet. SpringMVC默认用的是第二个 //<url-pattern> ...
- Reac全家桶笔记
函数作为无状态组件的使用: const EllipsisTdContent = ({ text, width }) => { return ( <div className="t ...
- 【java】java三种技术架构
JAVAEE : 企业环境下开发应用程序,servlet,jsp,针对web应用程序的开发. JAVASE:普通简单的桌面应用程序,商务应用程序.(java版扫雷) JAVAME手机应用软件,电子消费 ...