官网地址:http://mint-ui.github.io/#!/zh-cn
中文文档:http://mint-ui.github.io/docs/#/zh-cn2
示例展示:http://elemefe.github.io/mint-ui/#/
如何引入vue2项目:
在public的index.html页面,用CDN的形式引入,这样可以减少vendor包的体积,当然如果不介意可以安装在本地
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title></title> <!-- MintUI --> <link rel="stylesheet" href="https://unpkg.com/mint-ui/lib/style.css"> </head> <style> *{ list-style: none; margin:0; padding:0; text-decoration: none; } p{ margin:0; } </style> <body> <noscript> <strong>We‘re sorry but officialwebsite doesn‘t work properly without JavaScript enabled. Please enable it to continue.</strong> </noscript> <div id="app"></div> <!-- vue --> <script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script> <!-- axios --> <script src="https://cdn.bootcss.com/axios/0.19.0-beta.1/axios.min.js"></script> <!-- vuex --> <script src="https://cdn.bootcss.com/vuex/3.1.1/vuex.min.js"></script> <!-- vue-router --> <script src="https://cdn.bootcss.com/vue-router/3.0.7/vue-router.min.js"></script> <!-- MintUI --> <script src="https://unpkg.com/mint-ui/lib/index.js"></script> <!-- jquery --> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </body> </html>
然后再vue.config.js中配置中修改如下:
externals: { ‘vue‘: ‘Vue‘, ‘vuex‘: ‘Vuex‘, ‘vue-router‘: ‘VueRouter‘, ‘mint-ui‘: ‘MINT‘, ‘Axios‘:‘axios‘ }
修改main.js (注释)

修改store.js (注释)
// import Vue from "vue"; // import Vuex from "vuex"; // Vue.use(Vuex);
修改router.js (注释)
// import Vue from "vue"; import Router from "vue-router"; // Vue.use(Router);
如果之前安装了vue、vuex等上面通过cdn引入的文件,现在再package.json中删除对应字段,重新npm insatll安装一下,这样可以批量去掉不需要的依赖包。
之后运行一下,看看项目是否正常,看看MintUI是否成功引入

运行后显示的页面:

ok,到此vue项目中引入MintUI完毕!!如果只是引入MintUI只需要对应的把MintUI相关的做一下调整就可!!!
原文:https://www.cnblogs.com/fqh123/p/12009989.html