pnpm / npm / yarn

好用到手软的NPM包

字数：1.6k 阅读时长：7分钟 阅读：85

npm是JavaScript世界的包管理工具，并且是 Node.js 平台的默认包管理工具。
在开发过程中经常要使用第三方封装好的NPM工具包，所以日积月累都记录下来，以免突然用的时候找不到。

NPM

colors

描述： colors可以设置命令行控制台输出日志的颜色。

  • 安装
1
npm i -D colors
  • 使用
1
2
3
4
5
6
7
var colors = require('colors');
 
console.log('hello'.green); // outputs green text
console.log('i like cake and pies'.underline.red) // outputs red underlined text
console.log('inverse the color'.inverse); // inverses the color
console.log('OMG Rainbows!'.rainbow); // rainbow
console.log('Run the trap'.trap); // Drops the bass

yargs

描述： yargs通过解析参数和生成优雅的用户界面来帮助您构建交互式命令行工具。

  • 安装
1
npm i -D yargs
  • 使用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
#!/usr/bin/env node
const yargs = require('yargs/yargs')
const { hideBin } = require('yargs/helpers')

yargs(hideBin(process.argv))
  .command('serve [port]', 'start the server', (yargs) => {
    return yargs
      .positional('port', {
        describe: 'port to bind on',
        default: 5000
      })
  }, (argv) => {
    if (argv.verbose) console.info(`start server on :${argv.port}`)
    serve(argv.port)
  })
  .option('verbose', {
    alias: 'v',
    type: 'boolean',
    description: 'Run with verbose logging'
  })
  .parse()

say

描述： say是一个语言阅读模块，兼容各个平台。

  • 安装
1
npm i -D say
  • 使用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
// automatically pick platform
const say = require('say')

// or, override the platform
const Say = require('say').Say
const say = new Say('darwin' || 'win32' || 'linux')

// Use default system voice and speed
say.speak('Hello!')

// Stop the text currently being spoken
say.stop()

// More complex example (with an OS X voice) and slow speed
say.speak("What's up, dog?", 'Alex', 0.5)

// Fire a callback once the text has completed being spoken
say.speak("What's up, dog?", 'Good News', 1.0, (err) => {
  if (err) {
    return console.error(err)
  }

  console.log('Text has been spoken.')
});

// Export spoken audio to a WAV file
say.export("I'm sorry, Dave.", 'Cellos', 0.75, 'hal.wav', (err) => {
  if (err) {
    return console.error(err)
  }

  console.log('Text has been saved to hal.wav.')
})
  • 使用文档：say

semver

描述： NPM 的 semver 规范相关的工具包，可以判断版本、获取版本。

  • 安装
1
npm i -D semver
  • 使用
1
2
3
4
5
6
7
8
9
10
11
const semver = require('semver')

// 判断是否符合规范
semver.valid('1.2.3') // '1.2.3'
semver.valid('a.b.c') // null
// 判断 a 版本是否比 b 版本高
semver.gt('1.2.3', '9.8.7') // false
// 判断 a 版本是否比 b 版本低
semver.lt('1.2.3', '9.8.7') // true
// 判断符合某个版本范围的最低版本
semver.minVersion('>=1.0.0') // '1.0.0'

rimraf

描述： 相当于Linux系统的 rm -rf 命令，总之非常的好用。

  • 安装
1
npm i -D rimraf
  • 使用
1
2
3
4
5
6
7
const rimraf = require('rimraf');

rimraf('./dir/test.js', error => {
  if (!error) {
    console.log('删除成功');
  }
});

shelljs

描述： 用 js 来实现 shell 命令

  • 安装
1
npm i -D shelljs
  • 使用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
const shell = require('shelljs');

// 判断是否有相关开发环境
function hasGitNpm() {
  if (!shell.which('git')) {
    console.log('Sorry, this script requires git');
    shell.exit(1);
  }

  if (!shell.which('npm')) {
    console.log('Sorry, this script requires npm');
    shell.exit(1);
  }
}

hasGitNpm();

// 安装 npm 包
function installPkg(pkg, type) {
  const npm = shell.which('npm');
  if (!npm) {
    console.log('请先安装 npm');
    return;
  }
  const { code } = shell.exec(
    `${npm.stdout} install ${pkg} ${type || '--save'}`
  );
  if (code) {
    console.log(`安装 ${pkg} 失败，请手动安装`);
  }
}

installPkg('lodash');

glob / globby

描述： glob 是一种文件匹配模式，起源于 Unix，比如我们常见 *.js 匹配所有 js 文件就是使用了 glob 模式。globby是glob的增强版，异步更友好。

  • 安装
1
npm i -D glob
  • 使用
1
2
3
4
5
6
7
8
9
const glob = require("glob")

// options is optional
glob("**/*.js", options, function (er, files) {
  // files is an array of filenames.
  // If the `nonull` option is set, and nothing
  // was found, then files is ["**/*.js"]
  // er is an error object or null.
})

fs-extra

描述： Node 内置了 fs 模块供开发者和文件系统交互，但是用过的同学都知道，它的能力还是挺有限的。所以，在 fs 的基础上，社区提供了 fs-extra 工具包增强文件系统交互，并且提供了 Promise 的调用方式。

  • 安装
1
npm i -S fs-extra
  • 使用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
const fse = require('fs-extra');

(async () => {
  // 确认目录是否存在，如果不存在会创建目录
  await fse.ensureDir('./dir');

  // 复制文件
  await fse.copy('./dir/test.js', './dir/test2.js');

  // 读 JSON 文件
  const aJSON = await fse.readJSON('./dir/a.json');
  console.log(typeof aJSON, aJSON);

  // 写 JSON 文件
  await fse.writeJSON('./dir/test.json', { a: 1 }, { spaces: 2 });

  // 写 JSON 文件，如果目录不存在会创建
  await fse.outputJson('./dir/test.json', { a: 1 }, { spaces: 2 });

  // 删文件
  await fse.remove('./dir/test.json');
})();

FingerprintJS

描述： FingerprintJS 是一个浏览器指纹库，可通过查询浏览器属性并从中计算出散列的访问者标识符，从而生成一个用户指纹。

  • 安装
1
npm i -D @fingerprintjs/fingerprintjs
  • 使用
1
2
3
4
5
6
7
8
9
10
11
12
13
14
import FingerprintJS from '@fingerprintjs/fingerprintjs'

// Initialize an agent at application startup.
const fpPromise = FingerprintJS.load()

;(async () => {
  // Get the visitor identifier when you need it.
  const fp = await fpPromise
  const result = await fp.get()

  // This is the visitor identifier:
  const visitorId = result.visitorId
  console.log(visitorId)
})()

nanoid

描述： 一个小巧的、安全的、URL友好的、独特的 JavaScript 字符串 ID 生成器。

  • 安装
1
npm i -D nanoid
  • 使用
1
2
3
import { nanoid } from 'nanoid'
nanoid()   //=> "V1StGXR8_Z5jdHi6B-myT"
nanoid(4)  //=> "Mi4S"

uuid

描述： 创建随机 UUID 。

  • 安装
1
npm i -D uuid
  • 使用
1
2
const { v4: uuidv4 } = require('uuid');
uuidv4(); // ⇨ '1b9d6bcd-bbfd-4b2d-9b5d-ab8dfbbd4bed'

szyutils

描述： 前端通用工具库。提供了判断浏览器类型、格式化各种日期、获取url参数、queryString转对象、防抖函数、节流函数等常用函数

  • 安装
1
npm i -D szyutils

spy-debugger

描述： 一站式页面调试、抓包工具。远程调试任何手机浏览器页面，任何手机移动端webview（如：微信，HybridApp等）。支持HTTP/HTTPS，无需USB连接设备。

  • 安装
1
npm i -g spy-debugger

joi

描述： JavaScript 最强大的模式描述语言和数据验证器。

  • 使用文档：joi

jsonwebtoken

JSON Web Tokens 的实现。

积土成山，风雨兴焉；
积水成渊，蛟龙生焉。

欢迎访问：个人博客地址

本文作者： Tiven
发布时间： 2021-09-24
最后更新： 2023-08-08
本文标题： 好用到手软的NPM包
本文链接： https://www.tiven.cn/p/5f5cbec7/
版权声明： 本作品采用 CC BY-NC-SA 4.0 许可协议进行许可。转载请注明出处！
欢迎留言，提问 ^_^
个人邮箱： tw.email@qq.com
notification icon
博客有更新，将会发送通知给您！
博客发布通知
electron-updater 自动更新升级应用自动更新升级应用 | 天問-专注于大前端技术
electron 内置了 autoUpdater 自动更新功能，但是服务配置有些复杂，最后选择了 electron-updater 工具插件，这里就讲讲如何配置 electron-updater 来自动更新升级应用。