记一次整合elementui+mintui+vue的配置历程

记一次整合elementui+mintui+vue的配置历程

背景:vue项目做ipad端,目前使用vue-admin-templete的模板(基于elementui框架),需要整合mint-ui的某些控件适配移动端,由于已经引入了全部的Element-ui,为了避免冲突和减少内存占用,只需要对mint-ui进行按需引入。

第一步:

使用npm安装mint-ui

npm i mint-ui -S

第二步:

安装工具进行按需引入

npm install babel-plugin-component -D

第三步:

由于我原来是没有.babelrc文件的,首先我先执行

type null>.babelrc

在项目根目录下新建该文件,然后添加一下代码

{

"plugins": [

["component",

{

"libraryName": "mint-ui",

"style": true

},

"mint-ui"],

["component",

{

"libraryName": "element-ui",

"styleLibraryName": "theme-chalk"

},

"element-ui"

]

]

}

填坑:官方文档的这个部分一直报错,这是根据广大神通的网友总结出来的,最终跑通了

第四步:

在main.js文件中按需引入

import Loadmore from 'mint-ui/lib/loadmore'

Vue.component(Loadmore.name, Loadmore)

填坑:

根据官方文档描述,一开始使用import { Loadmore } from 'mint-ui'就会显示

后根据万能的网友的答案分析出上面的引入方法,最后正确引入了。

相关推荐

喝泻药多久有反应
365提款10万一般多久

喝泻药多久有反应

📅 09-13 👁️ 9176
陶岔渠首:南水北调的“水龙头” 湖北日报
365bet亚洲真人网

陶岔渠首:南水北调的“水龙头” 湖北日报

📅 10-14 👁️ 6066
為甚麼人死了會瞳孔放大
365bet怎么提款

為甚麼人死了會瞳孔放大

📅 07-15 👁️ 8733