一.classnames 现在到处都追求效率开发,所谓存在即合理,各种各样的开源包/项目火热,也是因为他们大大解决了之前复杂的逻辑.作为榜上前10的热门包:classnames.还真需要了解了解它才能仗'包'走天涯 官方定义: A simple JavaScript utility for conditionally joining classNames together. 理解: 帮助你在React项目更好地使用className 二.使用方法 在认识classnames之前,你可能会有一个疑…

一.copy-to-clipboard 官方定义: Simple module exposing copy function 理解: 一个超级简单的复制功能,并且这种方法适用于通过别的事件触发复制功能 什么意思呢?比如:我想设计一个在Select选择项改变的时候复制该选择项,这时候一般无法插入组件(等会会介绍一个react复制组件的npm),这时候用copy-to-clipboard就非常合适. 当然为了简单而使用也是非常合理的 用法 import copy from 'copy-to-clip…

一.bindme 官方定义: is a helper to bind a list of methods to an object reference 理解: 因为不推荐在render()里构建函数,作者就用了6行代码封装了函数绑定事件的代码. bindme的npm包实际上由6行ES5代码组成,但是确实方便了很多.这个包值得一用 二.用法 代替箭头函数和多层bind 有时候我们并不会直接在创建事件的时候bind,而是统一在constructor上绑定事件,如果一个模块大起来,就会出现好几十行绑定…

一.react-modal 官方定义: Accessible modal dialog component for React.JS 理解: 一个容易使用的React模态框组件 二.用法 有时候我们不用一些UI框架的时候(bs3.0.antd),就需要自己封装一些模态框.自己定义各种回调事件...等等 这时候可以考虑用一个npm模态框的包 安装 $ npm install react-modal import ReactModal from 'react-modal' 事件 isOpen: 模态…

一.react-dropzone 官方定义: Simple HTML5-compliant drag'n'drop zone for files built with React.js. 理解: 一个为react量身定制,基于H5 API:drop && drag可以实现拖拽上传文件的npm插件包 是的,以后再也不用自己苦苦地封装drop和drag了, react-dropzone使用非常简单,只需要调用一个事件. 当然这个包是针对于react的(直接作为组件使用),如果需要非组件的,直接…

以markdown-clear,创建过程为例,讲解整个NPM包创建和发布流程 1 如何创建一个包 1.1 创建并使用一个工程 在GitHub上新建一个仓库,其名markdown-clear clone 这个工程到本地 1.2 添加LICENCE或LICENSE文件, 说明对应的开源协议 到SPDX License List 或者Open Source Initiative,下载相应协议的模板,我们这里选用MIT 修改必要的协议时间和作者 MIT License Copyright (c) <ye…

前言 从去年年初开始,自己便下决心要写一个vue系列的博客,但时至今日,才写系列的第三篇博客,想来甚是惭愧. 但是慢归慢,每一篇都要保证质量,以及要写出自己的心路历程,防止自己工作中填的坑再让读者走一遍. vue上手相对react来说是比较简单的,对于vue的基本指令以及语法,应该没有什么能比官网更详细,更生动的了.仔细想来,vue值得一说的,在项目中会让新手感到困惑的,是vue的组件,今天就最近工作中用到的一个pdf查看组件,和大家聊聊vue的组件.最后会讲如何将自己的代码封装成一个npm包,…

从0到1发布一个npm包 author: @TiffanysBear 最近在项目业务中有遇到一些问题,一些通用的方法或者封装的模块在PC.WAP甚至是APP中都需要使用,但是对于业务的PC.WAP.APP往往是不同的业务.不同的代码库中,尽管已经将公用的组件和方法抽离到各自公共common中,但是各个大业务大方向上的公用封装依然不能满足需求. 比如一个计算文档类型大小的方法,可能都同时存在于各个业务的common中,假设是有3处代码库中均有:如果此时的需求是将文档类型或者大小的方法进行一些修改,…

Github 持续化集成 工作流 Npm包自动化发布 简介   持续集成指的是,频繁地(一天多次)将代码集成到主干. 它的好处主要有两个: 快速发现错误.每完成一点更新,就集成到主干,可以快速发现错误,定位错误也比较容易. 防止分支大幅偏离主干.如果不是经常集成,主干又在不断更新,会导致以后集成的难度变大,甚至难以集成.   持续集成的目的,就是让产品可以快速迭代,同时还能保持高质量.它的核心措施是,代码集成到主干之前,必须通过自动化测试.只要有一个测试用例失败,就不能集成.   GitHub…

目录 NPM 在线 离线 GEM 在线 离线 NPM NPM,即为Node的包管理工具,官网为 https://www.npmjs.com/,我们可以在站内搜索所需要的NPM包,了解相关的使用规则 安装NPM包有两种方式:线上与线下 线上 1. 连接官方源 下载npm管理工具后,默认是连接到官方的源,命令 npm config ls -l 或 npm config get registry 可查看相关的源 使用类似 npm install request 就可以安装某个包,更多命令可使用 npm…