年底了,总结下今年用到的一些有意思的《js轮子》(只是大概列出些比较有意思的库,每个标题都是超链接,可点击自行查阅)
希望能对您有用!

如有意思的 轮子 可以在评论列出一起讨论下


color

==功能==:JavaScript库,用于不可变的颜色转换和对CSS颜色字符串的支持。

npm install color

var color = Color('#7743CE').alpha(0.5).lighten(0.5);console.log(color.hsl().string());  // 'hsla(262, 59%, 81%, 0.5)'
 console.log(color.cmyk().round().array());  // [ 16, 25, 0, 8, 0.5 ]
 console.log(color.ansi256().object());  // { ansi256: 183, alpha: 0.5 }

uuidjs

==功能==:UUID.js-JavaScript的RFC兼容UUID生成器

// Create a version 4 (random number-based) UUID objectvar objV4 = UUID.genV4(); 
// Create a version 1 (time-based) UUID objectvar objV1 = UUID.genV1(); 
// Create a UUID object from a hexadecimal stringvar uuid = UUID.parse("a0e0f130-8c21-11df-92d9-95795a3bcd40"); 
// Get string representations of a UUID objectconsole.log(uuid.toString());   // "a0e0f130-8c21-11df-92d9-95795a3bcd40"console.log(uuid.hexString);    // "a0e0f130-8c21-11df-92d9-95795a3bcd40"console.log(uuid.hexNoDelim);   // "a0e0f1308c2111df92d995795a3bcd40"console.log(uuid.bitString);    // "101000001110000 ... 1100110101000000"console.log(uuid.urn);          // "urn:uuid:a0e0f130-8c21-11df-92d9-95795a3bcd40"
 // Compare UUID objectsconsole.log(objV4.equals(objV1));   // false
 // Get UUID version numbersconsole.log(objV4.version); // 4console.log(objV1.version); // 1
 // Get internal field values in 3 different forms via 2 different accessorsconsole.log(uuid.intFields.timeLow);                // 2699096368console.log(uuid.bitFields.timeMid);                // "1000110000100001"console.log(uuid.hexFields.timeHiAndVersion);       // "11df"console.log(uuid.intFields.clockSeqHiAndReserved);  // 146console.log(uuid.bitFields.clockSeqLow);            // "11011001"console.log(uuid.hexFields.node);                   // "95795a3bcd40"
 console.log(uuid.intFields[0]);                     // 2699096368console.log(uuid.bitFields[1]);                     // "1000110000100001"console.log(uuid.hexFields[2]);                     // "11df"console.log(uuid.intFields[3]);                     // 146console.log(uuid.bitFields[4]);                     // "11011001"console.log(uuid.hexFields[5]);

rc-upload

==功能==: 文件上传下载拖拽文件 及文件夹等

var Upload = require('rc-upload');var React = require('react');
React.render(, container);

react-copy-to-clipboard ã€clipboard

==功能==:react 

npm install --save react react-copy-to-clipboard


import React from 'react';
import ReactDOM from 'react-dom';
import {CopyToClipboard} from 'react-copy-to-clipboard';
 
class App extends React.Component {
  state = {
    value: '',
    copied: false,
  };
 
  render() {
    return (
      
         this.setState({value, copied: false})} />            this.setState({copied: true})}>           Copy to clipboard with span                     this.setState({copied: true})}>                               {this.state.copied ? Copied. : null}       
    );   } }   const appRoot = document.createElement('div'); document.body.appendChild(appRoot); ReactDOM.render(, appRoot);

numeral

==功能==:一个用于格式化和处理数字的javascript库。

var value = myNumeral.value();
// 1000

var myNumeral2 = numeral('1,000');

var value2 = myNumeral2.value();
// 1000
omit.js
==功能==:返回 åœ¨ç›®æ ‡å¯¹è±¡ä¸­ omit[删除; å¿½ç•¥] æŒ‡å®šå±žæ€§çš„对象; å®žç”¨ç¨‹åºåŠŸèƒ½ï¼Œç”¨äºŽåˆ›å»ºåˆ é™¤äº†æŸäº›å­—æ®µçš„å¯¹è±¡çš„æµ…è¡¨å‰¯æœ¬ã€‚
npm i --save omit.js

omit(obj: Object, fields: string[]): Object


var omit = require('omit.js');
omit({ name: 'Benjy', age: 18 }, [ 'name' ]); // => { age: 18


Moment.js

==功能==:一个JavaScript日期库,用于解析,验证,操作和格式化日期。

moment().format('MMMM Do YYYY, h:mm:ss a'); // December 22nd 2020, 10:55:15 ammoment().format('dddd');                    // Tuesdaymoment().format("MMM Do YY");               // Dec 22nd 20moment().format('YYYY [escaped] YYYY');     // 2020 escaped 2020moment().format();

Day.js

==功能==:Day.js 是一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样. 如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.js

dayjs().format('{YYYY} MM-DDTHH:mm:ss SSS [Z] A') // å±•示dayjs()  .set('month', 3)  .month() // èŽ·å–dayjs().add(1, 'year') // å¤„理dayjs().isBefore(dayjs()) // æŸ¥è¯¢

milliseconds

==~~~~功能==:用于将时间转换为毫秒。

var ms = require('milliseconds');

ms.seconds(2); // 2000ms.minutes(2); // 120000ms.hours(2);   // 7200000ms.days(2);    // 172800000ms.weeks(2);   // 1209600000ms.months(2);  // 5259600000ms.years(2);   // 63115200000

filesize

==功能==:filesize.js提供了一种简单的方法来从数字(浮点数或整数)或字符串中获取人类可读的文件大小字符串。

npm i filesize


filesize(500);                        // "500 B"
filesize(500, {bits: true});          // "4 Kb"
filesize(265318, {base: 10});         // "265.32 kB"
filesize(265318);                     // "259.1 KB"
filesize(265318, {round: 0});         // "259 KB"
filesize(265318, {output: "array"});  // [259.1, "KB"]
filesize(265318, {output: "object"}); // {value: 259.1, symbol: "KB", exponent: 1}
filesize(1, {symbols: {B: "Б"}});     // "1 Ð‘"
filesize(1024);                       // "1 KB"
filesize(1024, {exponent: 0});        // "1024 B"
filesize(1024, {output: "exponent"}); // 1
filesize(265318, {standard: "iec"});  // "259.1 KiB"
filesize(265318, {standard: "iec", fullform: true}); // "259.1 kibibytes"
filesize(12, {fullform: true, fullforms: ["байтов"]});  // "12 Ð±Ð°Ð¹Ñ‚ов"
filesize(265318, {separator: ","});   // "259,1 KB"
filesize(265318, {locale: "de"});   // "259,1 KB"


react-markdown

==功能==:使用备注的React的Markdown组件。

import { Row, Col, Menu, Affix, Anchor } from 'antd';
import ReactMarkdown from 'react-markdown/with-html';
import { isEmpty } from "lodash";

import HeadBlock from './HeadBlock';

import 'github-markdown-css/github-markdown.css'
import './index.less';

const { Link } = Anchor;

const articles = {
  '1': '/developer_guide.md',
  '2': '/user_manual.md'
}


/**
 *
 * @param lists
 * è¿™é‡Œåªåšä¸¤çº§å¤„理
 */
export const navsToTree = (lists: any[]) => {
  if (isEmpty(lists)) return [];
  // æå–第一个level为最大level åŽç»­æ¯”他大的一律为同级
  const maxLevel = lists[0].level;
  const newLists: any[] = [];
  lists.forEach((item: any) => {
    // ä¸€çº§ åŒçº§
    if (item.level <= maxLevel) {
      newLists.push(item)
    } else {
      // éžåŒçº§
      if (newLists[newLists.length - 1].children) {
        newLists[newLists.length - 1].children.push(item)
      } else {
        newLists[newLists.length - 1].children = [item]
      }
    }
  })
  return newLists;
}



const NormalTest: React.FC = () => {

  const [currentArticle, setCurrentArticle] = useState<{ url: string, content: any }>({ url: '', content: '' });

  const [treeNavs, setTreeNavs] = useState([])

  // åˆå§‹ä¸ºå¼€å‘文档
  useEffect(() => {
    // console.log(1);

    changeCurrentArticle(articles['1'])
  }, [])

  // è¿™é‡Œæ˜¯æ ¹æ®æ–‡æ¡£ä¿®æ”¹è¿›è¡ŒèŽ·å–ç›®å½•
  useEffect(() => {
    /**
     *  èŽ·å–æ‰€æœ‰çš„æ–‡ç« æ ‡é¢˜
     */
      // console.log(currentArticle);

    const markdownNavs = document.querySelectorAll('.article-nav')
    const navs: any[] = [];
    markdownNavs.forEach((item: any) => {
      const level = item.getAttribute('data-level');
      const value = item.textContent;
      const nodeKey = item.id;
      navs.push({ level, value, nodeKey })
    })
    transArticleNavs(navs)

  }, [currentArticle.content])

  // æ›´æ”¹å½“前文档
  const changeCurrentArticle = async (url: string) => {
    const res = await fetch(url);
    const content = await res.text();
    setCurrentArticle({ ...currentArticle, content, url })
  }

  // ä¹¦ç±å¯¼èˆªç‚¹å‡»
  const menuOnClick = (e: any) => {
    const url = articles[e.key]
    changeCurrentArticle(url)
  }

  // è½¬æ¢ä¸ºæ–‡ç« å³ä¾§ç›®å½•
  const transArticleNavs = (navs: any) => {

    // è½¬æ¢ä¸ºäºŒçº§å¯¼èˆª
    const treedevelopDocs = navsToTree(navs);
    setTreeNavs(treedevelopDocs)

  }

  return (
    <>
      
        
          
            
              å¼€å‘文档
              ä½¿ç”¨æ–‡æ¡£
            
          

        
        
          
                       
                                                        {                 treeNavs.map((item: any) => {                   if (item.children) {                     return (                                                {                           item.children.map((childItem: any) => (                                                        ))                         }                                            )                   } else {                     return (                                            )                   }                 })               }                                        
    >   ); }; export default NormalTest;

cytoscape | cytoscape-dagre

==功能==:Cytoscape.js是功能齐全的图论库。您是否需要对关系数据进行建模和/或可视化,例如生物数据或社交网络?如果是这样,Cytoscape.js就是您所需要的。Cytoscape.js包含一个图形理论模型和一个用于显示交互式图形的可选渲染器。该库旨在使程序员和科学家尽可能轻松地在其应用程序中使用图论,无论是用于Node.js应用程序中的服务器端分析还是用于丰富的用户界面。

Lodash

==功能==:函数工具类库

// Load the full build.
var _ = require('lodash');
// Load the core build.
var _ = require('lodash/core');
// Load the FP build for immutable auto-curried iteratee-first data-last methods.
var fp = require('lodash/fp');
 
// Load method categories.
var array = require('lodash/array');
var object = require('lodash/fp/object');
 
// Cherry-pick methods for smaller browserify/rollup/webpack bundles.
var at = require('lodash/at');
var curryN = require('lodash/fp/curryN');

patch-package node

==功能==:npm yran 补丁,用于改node_modules

cross-env node

==功能==:
cross-env这是一款运行跨平台设置和使用环境变量的脚本。

npm install --save-dev cross-env
{
  "scripts": {
    "parentScript": "cross-env GREET=\"Joe\" npm run childScript",
    "childScript": "cross-env-shell \"echo Hello $GREET\""
  }
}


bignumber.js

==功能==:一个用于任意精度十进制和非十进制算术的JavaScript库

https://mikemcl.github.io/bignumber.js/https://juejin.cn/post/6844903704714280968#heading-7

QRCode.js、 qrcode.vue

==功能==:

npm install --save qrcode.vue
npm i qrcodejs2


   getBlob(base64) {
      const mimeString = base64.split(',')[0].split(':')[1].split(';')[0]; // mime类型
      const byteString = atob(base64.split(',')[1]); // base64 è§£ç 
      const arrayBuffer = new ArrayBuffer(byteString.length); // åˆ›å»ºç¼“冲数组
      const intArray = new Uint8Array(arrayBuffer); // åˆ›å»ºè§†å›¾
      for (let i = 0; i < byteString.length; i += 1) {
        intArray[i] = byteString.charCodeAt(i);
      }
      return new Blob([intArray], {
        type: mimeString,
      });
    },
    savePicture(Url = this.qrcodeUrl) {
      const blob = new Blob([''], { type: 'application/octet-stream' });
      const url = URL.createObjectURL(blob);
      const a = document.createElement('a');
      a.href = Url;
      // eslint-disable-next-line prefer-destructuring
      a.download = Url.replace(/(.*\/)*([^.]+.*)/gi, '$2').split('?')[0];
      const e = document.createEvent('MouseEvents');
      e.initMouseEvent(
        'click',
        true,
        false,
        window,
        0,
        0,
        0,
        0,
        0,
        false,
        false,
        false,
        false,
        0,
        null,
      );
      a.dispatchEvent(e);
      URL.revokeObjectURL(url);
    },
    _qrcode(url) {
      const div = document.createElement('div');
      // eslint-disable-next-line new-cap
      const code = new QRCode(div, {
        text: url,
        width: 500,
        height: 500,
        colorDark: '#000000',
        colorLight: '#ffffff',
        correctLevel: QRCode.CorrectLevel.L,
      });
      // è¿™é‡Œå¦‚果需要在页面上展示的话,就将div节点给添加到dom树上去;node.appendChild(div)
      const canvas = code._el.querySelector('canvas'); // èŽ·å–ç”ŸæˆäºŒç»´ç ä¸­çš„canvas,并将canvas转换成base64
      const base64Text = canvas.toDataURL('image/png');
      const blob = this.getBlob(base64Text); // å°†base64转换成blob对象
      return window.URL.createObjectURL(blob);
    },

cssnano、js-beautify

==功能==: css js 压缩工具

cors node

==功能==:CORS是一个node.js软件包,用于提供可用于通过各种选项启用CORS的Connect / Express中间件。

npm install cors


var cors = require('cors');
app.use(
  cors({
    origin: ['http://localhost:8000'],
    methods: ['GET', 'POST'],
    alloweHeaders: ['Conten-Type', 'Authorization'],
  })
);


countup.js

==功能==:数字滚动插件使用方法详解

npm i countup.js

interface CountUpOptions {
  startVal?: number; // number to start at (0)
  decimalPlaces?: number; // number of decimal places (0)
  duration?: number; // animation duration in seconds (2)
  useGrouping?: boolean; // example: 1,000 vs 1000 (true)
  useEasing?: boolean; // ease animation (true)
  smartEasingThreshold?: number; // smooth easing for large numbers above this if useEasing (999)
  smartEasingAmount?: number; // amount to be eased for numbers above threshold (333)
  separator?: string; // grouping separator (',')
  decimal?: string; // decimal ('.')
  // easingFn: easing function for animation (easeOutExpo)
  easingFn?: (t: number, b: number, c: number, d: number) => number;
  formattingFn?: (n: number) => string; // this function formats result
  prefix?: string; // text prepended to result
  suffix?: string; // text appended to result
  numerals?: string[]; // numeral glyph substitution
}

js-base64

==功能==:另一个Base64转码器。

npm install --save js-base64

require=require('esm')(module);
import {Base64} from 'js-base64';


let latin = 'dankogai';
let utf8  = '小飼弾'
let u8s   =  new Uint8Array([100,97,110,107,111,103,97,105]);
Base64.encode(latin);             // ZGFua29nYWk=
Base64.btoa(latin);               // ZGFua29nYWk=
Base64.btoa(utf8);                // raises exception
Base64.fromUint8Array(u8s);       // ZGFua29nYWk=
Base64.fromUint8Array(u8s, true); // ZGFua29nYW which is URI safe
Base64.encode(utf8);              // 5bCP6aO85by+
Base64.encode(utf8, true)         // 5bCP6aO85by-
Base64.encodeURI(utf8);           // 5bCP6aO85by-

json-bigint

==功能==: Native Bigint是最近添加到JS的,因此我们添加了一个利用它的选项,而不是bignumber.js。但是,使用本机BigInt进行解析仍然是向后兼容的选项。

var JSONbig = require('json-bigint');
 
var json = '{ "value" : 9223372036854775807, "v2": 123 }';
console.log('Input:', json);
console.log('');
 
console.log('node.js built-in JSON:');
var r = JSON.parse(json);
console.log('JSON.parse(input).value : ', r.value.toString());
console.log('JSON.stringify(JSON.parse(input)):', JSON.stringify(r));
 
console.log('\n\nbig number JSON:');
var r1 = JSONbig.parse(json);
console.log('JSONbig.parse(input).value : ', r1.value.toString());
console.log('JSONbig.stringify(JSONbig.parse(input)):', JSONbig.stringify(r1));

vuejs-datetimepicker

==功能==:

npm install vuejs-datetimepicker



 


vue-meta-info

==功能==:基于Vue 2.0 的单页面 meta info 管理.


 

vue-smooth-scroll

==功能==:Scroll

npm install --save vue-smooth-scrollimport vueSmoothScroll from 'vue-smooth-scroll'Vue.use(vueSmoothScroll)

prismjs

==功能==:Prism是一个轻量,健壮,优雅的语法高亮库。这是Dabblet的衍生项目。

vuex-persistedstate

==功能==:

npm install --save vuex-persistedstateimport createPersistedState from 'vuex-persistedstate';import * as Cookies from 'js-cookie';import cookie from 'cookie'; 
export default ({ store, req }) => {
    createPersistedState({
        paths: [...],
        storage: {
            getItem: (key) => {                // See https://nuxtjs.org/guide/plugins/#using-process-flags
                if (process.server) {
                    const parsedCookies = cookie.parse(req.headers.cookie);                    return parsedCookies[key];
                } else {                    return Cookies.get(key);
                }
            },            // Please see https://github.com/js-cookie/js-cookie#json, on how to handle JSON.
            setItem: (key, value) =>
                Cookies.set(key, value, { expires: 365, secure: false }),
            removeItem: key => Cookies.remove(key)
        }
    })(store);
};

vue-slider-component

==功能==:一个高度定制化的滑块组件

$ yarn add vue-slider-component
# npm install vue-slider-component --save

CodeMirror

==功能==:CodeMirror是使用JavaScript为浏览器实现的多功能文本编辑器。它专门用于编辑代码,并具有100多种语言模式和各种插件,可实现更高级的编辑功能。每种语言都带有功能齐全的代码和语法高亮显示,以帮助阅读和编辑复杂代码。

vue-codemirror

==功能==:

       
      
import { codemirror } from 'vue-codemirror';import { getEthdb } from '@/api';import 'codemirror/lib/codemirror.css';import 'codemirror/theme/idea.css';// import 'codemirror/theme/base16-dark.css';import 'codemirror/theme/panda-syntax.css';import 'codemirror/addon/hint/show-hint.css';import 'codemirror/lib/codemirror';import 'codemirror/mode/sql/sql';import 'codemirror/addon/hint/show-hint';import 'codemirror/addon/hint/sql-hint';        
export default {
    data(){
        retrun {
            query: {
                sql: 'SELECT * FROM ethblock LIMIT 200',
             },
              cmOptions: {
                scroll: false,
                tabSize: 4,
                lineNumbers: false,
                line: false,
                indentWithTabs: true,
                smartIndent: true,
                autofocus: false,
                mode: 'text/x-mariadb',
                theme: 'idea',
                hintOptions: {
                  completeSingle: false,
                },
              },
        }
    },
    methods:{
     onCodemirrorReady(cm) {
      cm.on('keypress', () => {
        cm.showHint();
      });
    },
     onCodemirrorInput(newQuery) {      this.query.sql = newQuery;
    },
    }
    
    
}

portfinder || get-port node

==功能==:端口查看器

[sudo] npm install portfinderportfinder.getPort({    port: 3000,    // minimum port
    stopPort: 3333 // maximum port
}, callback);

regedit node

==功能==:使用node.js和Windows脚本宿主对Windows注册表进行读取,写入,列出和处理各种时髦的事情。

lowdb

==功能==:适用于Node,Electron和浏览器的小型JSON数据库。由Lodash驱动。 ⚡️

npm install lowdb
const low = require('lowdb')
const FileSync = require('lowdb/adapters/FileSync')
 
const adapter = new FileSync('db.json')
const db = low(adapter)
 
// Set some defaultsdb.defaults({ posts: [], user: {} })
  .write()
 
// Add a post
db.get('posts')
  .push({ id: 1, title: 'lowdb is awesome'})
  .write()
 
// Set a user using Lodash shorthand syntax
db.set('user.name', 'typicode')
  .write()

cheerio node

==功能==:为服务器特别定制的,快速、灵活、实施的jQuery核心实现. 爬虫

npm install cheerio
const cheerio = require('cheerio');
const $ = cheerio.load('

Hello world

'); $('h2.title').text('Hello there!'); $('h2').addClass('welcome'); $.html();//=> 

Hello there!

libxmljs

==功能==:解析xml

node-fetch、 got node

==功能==:node-ajax

ora node

==功能==:优雅的终端旋转器

const ora = require('ora'); 
const spinner = ora('Loading unicorns').start();
 
setTimeout(() => {
    spinner.color = 'yellow';
    spinner.text = 'Loading rainbows';
}, 1000);

node-mkdirp ã€rimraf node

==功能==:Like mkdir -p UNIX 命令 rm-rf . nodejs 新建创建文件

var mkdirp = require('mkdirp');
    
mkdirp('/tmp/foo/bar/baz', function (err) {    if (err) console.error(err)    else console.log('pow!')
});

shelljs

==功能==:hellJS是在Node.js API之上的Unix shell命令的可移植(Windows / Linux / OS X)实现。您可以使用它消除shell脚本对Unix的依赖,同时仍然保留其熟悉而强大的命令。您还可以全局安装它,以便可以从Node项目外部运行它-告别那些讨厌的Bash脚本!

var shell = require('shelljs'); 
if (!shell.which('git')) {
  shell.echo('Sorry, this script requires git');
  shell.exit(1);
} 
// Copy files to release dirshell.rm('-rf', 'out/Release');
shell.cp('-R', 'stuff/', 'out/Release'); 
// Replace macros in each .js fileshell.cd('lib');
shell.ls('*.js').forEach(function (file) {
  shell.sed('-i', 'BUILD_VERSION', 'v0.1.2', file);
  shell.sed('-i', /^.*REMOVE_THIS_LINE.*$/, '', file);
  shell.sed('-i', /.*REPLACE_LINE_WITH_MACRO.*\n/, shell.cat('macro.js'), file);
});
shell.cd('..');

shx

==功能==:Shx 是一个包装 ShellJS Unix 命令的包装器,为 npm 包脚本中简单的类 Unix 跨平台命令提供了一个简单的解决方案

  • ShellJS: Good for writing long scripts, all in JS, running via NodeJS (e.g. node myScript.js).

  • shx: Good for writing one-off commands in npm package scripts (e.g. "clean": "shx rm -rf out/").

npm install shx --save-devpackage.json:
{  "scripts": {    "clean": "shx rm -rf build dist && shx echo Done"
  }
}

node-ssh

==功能==:Node-SSH 是 ssh2的一个非常轻量级的 Promise 包装器。

chalk

==功能==: 给终端嵌套您想要的样式。

const chalk = require('chalk');const log = console.log;// Combine styled and normal stringslog(chalk.blue('Hello') + ' World' + chalk.red('!'));// Compose multiple styles using the chainable APIlog(chalk.blue.bgRed.bold('Hello world!'));// Pass in multiple argumentslog(chalk.blue('Hello', 'World!', 'Foo', 'bar', 'biz', 'baz'));// Nest styleslog(chalk.red('Hello', chalk.underline.bgBlue('world') + '!'));// Nest styles of the same type even (color, underline, background)log(chalk.green(    'I am a green line ' +
    chalk.blue.underline.bold('with a blue substring') +    ' that becomes green again!'));

Nzh

==功能==:适用于需要转换阿拉伯数字与中文数字的场景。
特点如下:

  • 以字符串的方式转换,没有超大数及浮点数等问题(请自行对原数据进行四舍五入等操作)

  • 支持科学记数法字符串的转换

  • 支持口语化

  • 支持自定义转换(不论是兆,京还是厘都可以用)

  • 对超大数支持用争议教少的万万亿代替亿亿

  • 当然,你还可以把中文数字再转回阿拉伯数字

npm install nzh --savevar Nzh = require("nzh");var nzhcn = require("nzh/cn"); //直接使用简体中文var nzhhk = require("nzh/hk"); //繁体中文var nzhcn = Nzh.cn;                 // ä½¿ç”¨ç®€ä½“中文,  å¦å¤–有 Nzh.hk -- ç¹ä½“中文nzhcn.encodeS(100111);              // è½¬ä¸­æ–‡å°å†™ >> åä¸‡é›¶ä¸€ç™¾ä¸€åä¸€nzhcn.encodeB(100111);              // è½¬ä¸­æ–‡å¤§å†™ >> å£¹æ‹¾ä¸‡é›¶å£¹ä½°å£¹æ‹¾å£¹nzhcn.encodeS("1.23456789e+21");    // ç§‘学记数法字符串 >> åäºŒä¸‡ä¸‰åƒå››ç™¾äº”十六万万七千八百九十万亿nzhcn.toMoney("100111.11");         // è½¬ä¸­æ–‡é‡‘额 >> äººæ°‘币壹拾万零壹佰壹拾壹元壹角壹分

decko

节流 防抖
https://blog.csdn.net/qq_2955...

==功能==:三个最有用的装饰器的简洁实现:

  • @bind:this在方法内使常量的值

  • @debounce:限制对方法的调用

  • @memoize:根据参数缓存返回值

npm i -S decko

p-queue

==功能==:对限制速率的异步(或同步)操作很有用。例如,在与REST API交互时或在执行CPU /内存密集型任务时。

const {default: PQueue} = require('p-queue');const got = require('got');const queue = new PQueue({concurrency: 1});(async () => {    await queue.add(() => got('https://sindresorhus.com'));
    console.log('Done: sindresorhus.com');
})();

(async () => {    await queue.add(() => got('https://avajs.dev'));
    console.log('Done: avajs.dev');
})();

(async () => {    const task = await getUnicornTask();    await queue.add(task);    console.log('Done: Unicorn task');
})();

sleep

==功能==:sleep

npm i sleepvar sleep = require('sleep');function msleep(n) {
  Atomics.wait(new Int32Array(new SharedArrayBuffer(4)), 0, 0, n);
}function sleep(n) {
  msleep(n*1000);
}

delay

==功能==:将承诺推迟一定的时间

npm install delayconst delay = require('delay');(async () => {
    bar();    await delay(100);    // Executed 100 milliseconds later
    baz();
})();

better-scroll

==功能==:BetterScroll 是一款重点解决移动端(已支持 PC)各种滚动场景需求的插件。它的核心是借鉴的 iscroll 的实现,它的 API 设计基本兼容 iscroll,在 iscroll 的基础上又扩展了一些 feature 以及做了一些性能优化。

https://better-scroll.github.io/docs/zh-CN/guide/#betterscroll-%E6%98%AF%E4%BB%80%E4%B9%88

create-keyframe-animation

==功能==:使用JavaScrip在浏览器中动态生成CSS关键帧动画(不维护了)

vconsole

==功能==:一个轻量、可拓展、针对手机网页的前端开发者调试面板。

" title="" data-original-title="复制" style="box-sizing: border-box; appearance: button; cursor: pointer; display: block; float: left; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjQiIGhlaWdodD0iMTYiPjxkZWZzPjxwYXRoIGlkPSJhIiBkPSJNMCAwaDE2djE2SDB6Ii8+PG1hc2sgaWQ9ImIiIHdpZHRoPSIxNiIgaGVpZ2h0PSIxNiIgeD0iMCIgeT0iMCIgZmlsbD0iI2ZmZiIgbWFza0NvbnRlbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIG1hc2tVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giPjx1c2UgeGxpbms6aHJlZj0iI2EiLz48L21hc2s+PC9kZWZzPjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PHBhdGggZmlsbD0iI0ZGRiIgZD0iTTM0IDJ2MTNoMTF2MUgzM1YyaDF6bTktMnY1aDR2OUgzNVYwaDh6bS0yIDZoLTF2MmgtMnYxaDJ2MmgxVjloMlY4aC0yVjZ6bTMtNmwzIDRoLTNWMHpNMzEgM3YxM0gyMFYzaDExem0tMy0zdjJoLTFWMWgtOXYxMmgxdjFoLTJWMGgxMXptLTEgMTJoLTV2MWg1di0xem0xLTJoLTZ2MWg2di0xem0wLTJoLTZ2MWg2Vjh6bTEtMmgtN3YxaDdWNnoiLz48dXNlIHN0cm9rZT0iI0ZGRiIgc3Ryb2tlLWRhc2hhcnJheT0iMSIgc3Ryb2tlLXdpZHRoPSIyIiBtYXNrPSJ1cmwoI2IpIiB4bGluazpocmVmPSIjYSIvPjxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik03IDl2NEgzVjloNHptNiAwdjRIOVY5aDR6TTcgM3Y0SDNWM2g0em02IDB2NEg5VjNoNHptNTEtM3YxNmgtM3YtMWgyVjFoLTJWMGgzek01MSAwdjFoLTJ2MTRoMnYxaC0zVjBoM3ptMTAgM3YxMEg1MVYzaDEwem0tMiA3aC00djFoNHYtMXptLTEtMmgtNXYxaDVWOHptMS0yaC00djFoNFY2em0tMS0yaC01djFoNVY0eiIvPjwvZz48L3N2Zz4="); height: 16px; width: 16px; background-size: auto 16px; margin: 4px 5px; opacity: 0.5; background-position: -16px 0px !important;">