组件封装及插件发布npm
文章平均质量分 59
学习封装组件,发布插件到npm
落花流雨
这个作者很懒,什么都没留下…
展开
-
仿ele封装vue-ui 组件库
模仿element-ui封装vue组件库 初始化项目–优化字体图标 使用vue脚手架初始化一个项目:使用 vue created my-ui,创建一个名为my-ui的项目 优化iconfont字体图标: 方法: 第一步:将选择好的字体图标,添加项目。 第二步:然后点击更多操作,选择编辑项目 第三步:修改FontClass/Symbol前缀 和 Font Family,统一修改为:vh-icon- 第四步:将字体图标文件,复制粘贴到项目 iconfont.css 将初始的iconfont类改为了[class*原创 2020-07-19 15:47:26 · 583 阅读 · 0 评论 -
自定义加载中的loading组件
自定义加载中的loading组件 components / loading.vue页面 <template> <div class="loading-container" v-if="showWrap" :class="showContent ?'fadein':'fadeout'"> <div class="loading-mask"></div> <div class="loading-content"> <原创 2020-09-04 14:29:18 · 1091 阅读 · 0 评论 -
vue全局组件自动加载注册(重点)
全局组件自动加载注册(重点) 官方文档 在src / components / 新建global文件夹;(这个路径与components/index.js中的配置保存一致) 第一步:global / test.vue(测试使用) 第二步:在需要的页面以标签的形式使用即可。<base-test></base-test> <template> <div class="create"> this is a test </div> </templa原创 2020-05-14 21:37:19 · 702 阅读 · 0 评论 -
Vue封装组件并发布npm
install Vue的插件必须提供一个公开方法install,该方法会在你使用该插件, 也就是 Vue.use(yourPlugin)时被调用。这样也就给Vue全局注入了你的所有的组件。 你为什么要二次封装el组件? 提供开发效率 提供组件的复用性(组件逻辑较为复杂的时候,封装可以让下次复用更简单) 第 1 章:组件封装 使用方法如下: 在项目 / main.js import ui2010 from 'ui-2010'; // 引入结构 import 'ui-2010/styles/ui20原创 2021-03-16 00:46:14 · 606 阅读 · 3 评论