27-vue中 UI组件库的使用

最新推荐文章于 2022-07-24 19:14:29 发布

不许人间见秃头xbw

最新推荐文章于 2022-07-24 19:14:29 发布

阅读量208

点赞数

分类专栏： Vue尚硅谷学习旅程文章标签： vue vue.js javascript

本文为博主原创文章，未经博主允许不得转载

本文链接：https://blog.csdn.net/a_bow/article/details/113826864

版权

Vue尚硅谷学习旅程专栏收录该内容

44 篇文章 2 订阅

订阅专栏

参照网站
链接: vue插件(移动端).
链接: vue插件库(PC端).

提示
以vue插件(移动端)为例：
安装mini-ui库的命令:

npm install --save mint-ui

要实现按需打包，也要执行命令并修改.babelrc文件:

npm install --save-dev babel-plugin-component

将.babelrc文件修改为：

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": ["transform-vue-jsx", "transform-runtime", ["component", [
    {
      "libraryName": "mint-ui",
      "style": true
    }
  ]]]
}

如图：
在这里插入图片描述

解决移动端点击延迟在html.js文件中所引入的代码

<script src="https://as.alipayobjects.com/g/component/fastclick/1.0.6/fastclick.js"></script>
    <script>
      if ('addEventListener' in document) {
      document.addEventListener('DOMContentLoaded', function() {
      FastClick.attach(document.body);
      }, false);
      }
      if(!window.Promise) {
      document.writeln('<script + src="https://as.alipayobjects.com/g/component/es6-promise/3.2.2/es6-promise.min.js"'+'>'+'<'+'/'+'script>');
      }
    </script>