摘要:写个命令行工具上面的方式是可以得到我们想要的结果,可是如果我想从一批名字中选一个可用的,就没有那么方便了,就要一个一个试了。二开始写工具之前有一篇文章,讲了怎么写一个命令行工具,见这里手把手教你写命令行工具。
</>复制代码
事情是这样的:因为我经常会写一些npm包,但是有时候我写完一个包,npm publish 的时候却被提示说包名字被占用了,要不就改名字,要不就加scope,很无奈。
npm 命令行可以通过 npm view 的方式去得知一个包是否存在,但是无法批量得知,所以就想着写一个工具来批量选名:)
本教程的相关代码已经全上传到github: 源代码
NPM方式
在写工具之前,我们先看看怎么通过 npm 提供的命令来得知包名是否被占用。
npm view
通过 npm view -h 我们可以得知其用法:
</>复制代码
npm view [<@scope>/][@] [[.subfield]...] aliases: v, info, show
通过以上命令来看看 unused-npm-names 包:
</>复制代码
npm view unused-npm-names
# 或者
npm info unused-npm-names
会输出:
</>复制代码
{ name: "unused-npm-names",
"dist-tags": { latest: "1.1.1" },
versions: [ "1.0.0", "1.0.1", "1.1.0", "1.1.1" ],
time:
{ created: "2018-09-07T02:53:05.277Z",
"1.0.0": "2018-09-07T02:53:05.439Z",
modified: "2018-09-07T03:44:06.363Z",
"1.0.1": "2018-09-07T03:07:46.542Z",
"1.1.0": "2018-09-07T03:35:40.221Z",
"1.1.1": "2018-09-07T03:44:03.534Z" },
maintainers: [ "pjy <731401082@qq.com>" ],
description: "Find unused npm names",
homepage: "https://github.com/PengJiyuan/unused-npm-names#readme",
keywords: [ "npm", "names", "unused", "find" ],
repository:
{ type: "git",
url: "git+https://github.com/PengJiyuan/unused-npm-names.git" },
author: "PengJiyuan",
bugs:
{ url: "https://github.com/PengJiyuan/unused-npm-names/issues" },
license: "MIT",
readmeFilename: "README.md",
version: "1.1.1",
main: "index.js",
bin: { unn: "cli.js" },
scripts: { test: "echo "Error: no test specified" && exit 1" },
dependencies: { axios: "^0.18.0", chalk: "^2.4.1", commander: "^2.17.1" },
gitHead: "818611db1c2baeb589cb3f639559ab6afc9f8e8f",
dist:
{ integrity: "sha512-t9bCfY3qbeVY54QC6Cznn3YhM0jq6HX0fE0r5TMAq1IOzu+NQ/caA8tfj62pZtDuZKb9R29ne7UyPB+4zAAplw==",
shasum: "0b7c162f7656c0d74868bf567713150488f8c473",
tarball: "https://registry.npmjs.org/unused-npm-names/-/unused-npm-names-1.1.1.tgz",
fileCount: 5,
unpackedSize: 4544,
"npm-signature": "-----BEGIN PGP SIGNATURE-----
Version: OpenPGP.js v3.0.4
Comment: https://openpgpjs.org
wsFcBAEBCAAQBQJbkfQDCRA9TVsSAnZWagAAwS4QAKFC1MnosxmJEws07U4O
gfUPLP04ZLZqtW6nuB/29A72DE1+bh/TGsir83r/sYf1TAPSLOCRd3Nrky3A
7+umUUOl5zGU5WyG86Fo2XOl5cYgXXWXU6LcZufG/cwM3Xi9MUfxnT7zCEWt
QPAE8Oh9UhkWCnvFMBA6M6knqK9K08nQf0Ke55UoiuX+OqF8BUlNw8LqEwrI
MTW8hpjKqsAdo3JhBu0ZkrfTRMq7cTawfjAg+qDs4SSTuWD9OJ9d/2y4OC/p
X6+3I+Et+SqFJxjGDBounjF1GYYiH3dQPRN8UWL1p9Ypu6YsiZ7l8dp6RH15
HFUv6lsCmZvhkKc1zO1pY67xUOA9VbLjhXtObwopFvCIehlv3cCw5FMwoa7x
z+tou0J4II6n68cG6IfTt+9odi9abj7M2YxStW32Miu3efhpXiw2PpX3HWOW
jkY7IQryyxJbQIdKHJqJ59fADHLxpdmr6WADYWt8mKI+9TK9onpSgFgX4udw
g7fXN3z/L6i7yY+0fvvX/b0jjVzVFNP5kFnUBSnWk/Hjm+h96QS+0xfRCRNv
5CmVT2kbxYNAdFsFFoNCqHqE+uQoMrSwBw1SIJdybWjs84QrLOrDFjhKypev
l6bzrgcyE0VWYY1A+zdyquL1cQ+xEJacsfN5NbicxTZhDU0enAtcxhKSe7bz
J9CP
=t8xy
-----END PGP SIGNATURE-----
" },
directories: {} }
这样的输出太长了,我们可以只看 unused-npm-names 最近的版本号:
</>复制代码
npm view unused-npm-names version
会输出:
</>复制代码
1.1.1
当然,如果这个包不存在的话,就会报 404 的错误,我们也就知道这个包名是否被占用了。
写个命令行工具上面的方式是可以得到我们想要的结果,可是如果我想从一批名字中选一个可用的,就没有那么方便了,就要一个一个试了。
如果有一个工具可以像这样使用:
</>复制代码
unn react react-router react-dom react-pp react-fdasf
能一步鉴别所有的包,那就太方便了。
所以,我们一步一步来看一下应该怎么实现这个功能。
一、看npm如何做的我们通过 npm view 可以查看一个包的信息,那么在走这个命令的时候,npm 肯定是发了一个请求去拿到的这个包的数据,那么我们怎么知道 npm 发的什么请求呢?
</>复制代码
# 加 --verbose 后缀来看详细的输出
npm view unused-npm-names --verbose
会输出:
</>复制代码
...
npm http request GET https://registry.npmjs.org/unused-npm-names
...
npm info ok
我们在其中发现,npm 发了个 GET 请求,请求的url是 https://registry.npmjs.org/unused-npm-names。
哦,那知道了,我们可以请求 https://registry.npmjs.org/${packageName} 来获取名为 packageName 的包信息。当然,在npm的官方仓库也能找到相关api的用法:package-metadata。
二、开始写工具之前有一篇文章,讲了怎么写一个命令行工具,见这里:手把手教你写命令行工具。这篇文章就不从怎么从零开始构建一个命令行工具开始了,我们直接来代码:
文件目录大概是这样:
</>复制代码
unused-npm-names
├── node_modules
├── package.json
├── cli.js (bin)
└── index.js (main)
package.json:
</>复制代码
{
"name": "unused-npm-names",
"version": "1.0.0",
"description": "Find unused npm names",
"main": "index.js",
"bin": {
"unn": "cli.js"
},
"scripts": {
"test": "echo "Error: no test specified" && exit 1"
},
"license": "MIT",
"dependencies": {
"axios": "^0.18.0",
"chalk": "^2.4.1",
"commander": "^2.17.1"
}
}
通过 package.json 中设置 bin 字段,我们将命令的名字设置为 unn,比较简短,方便实用。
我们把查询的主逻辑放到 index.js 中,把命令行逻辑放到 cli.js 中,这样的话我们既可以通过 cli 的方式去使用,也可以通过 require 的方式在 nodejs 脚本中使用。
</>复制代码
// index.js
const axios = require("axios"); // 用于发送 http 请求
const chalk = require("chalk"); // 终端输出带颜色的文本
// search方法的参数是一个数组,存放着需要查询的包的名字
// 比如我们要查询 react和react-dom,那么search(["react", "react-dom"])
function search(pkgs = []) {
if (!Array.isArray(pkgs)) {
throw "Param should be an array.";
}
console.log();
pkgs.forEach((pkg) => {
axios.get(`https://registry.npmjs.org/${pkg}`)
.then((res) => {
// 如果请求成功,说明包存在,那么名字被占用。
console.log(`${chalk.cyan(pkg)}: ${chalk.red("Used ❌")}`);
})
.catch((err) => {
// 如果请求失败,并且是因为404报错,那么证明包不存在,名字可用。
if (err.stack && /Request failed with status code 404/.test(err.stack)) {
console.log(`${chalk.cyan(pkg)}: ${chalk.green("Unused ✅")}`);
} else {
// 处理未知情况
console.log(`${chalk.cyan(pkg)}: ${chalk.gray("Unknown
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/97530.html
摘要:命令行工具,即。我们在写命令行工具的时候,需要指定一个可执行文件。或者四调试我们全局安装一个包后,可以全局调用这个命令行工具。 命令行工具,即 Cli(command-line interface)。是在图形用户界面得到普及之前使用最为广泛的用户界面,它通常不支持鼠标,用户通过键盘输入指令,计算机接收到指令后,予以执行。在学习这篇教程之前,你需要先了解NodeJs,NPM和一些常用的...
摘要:众所周知,在大公司中进行大的改革很难。目前公司有超过名开发人员,其中有个以上是前端。从年起,已经在一些小规模团队中探索使用。在年的前端调查中,静态类型系统呼声最高。在我们的主仓库中,绝大多数的公共依赖都已经由做到了类型声明。 特别说明 这是一个由simviso团队进行的关于Airbnb大规模应用TypeScript分享的翻译文档,分享者是Airbnb的高级前端开发Brie Bunge ...
摘要:但在生产环境下,如果不指定保存依赖的版本号会存在问题。它会生成一个文件,不仅记录了当前环境中使用的模块精确的版本号,还记录了这些模块的其他依赖的版本,以此类推。 本文来自国外新手向技术博客RisingStack。有兴趣的同学可点击原文查看。 相信npm install是npm-cli最常用的功能,但其实它还有很多其他可挖掘的地方。在本文中,你将会学习如何在应用开发的整个生命周期中——...
摘要:博客地址这篇文章是我在众成翻译翻译的一篇文章,一篇的入门指南,原文链接的出现使得用写服务端应用成为可能。你可以看到,这个过程也安装了其他的模块,它们都是的所依赖的模块。但是,得到的输出信息会很冗长,我们可以加上来精简一下输出。 github 博客地址: https://github.com/zengxiaota... 这篇文章是我在 众成翻译 翻译的一篇文章,一篇 npm 的入门指南,...
摘要:三配置环节目的一是为之后的环节初始化工作流参数,二是准备好应用文件夹内容即要打包的目标文件夹做的事解析命令行参数,初始化工作参数,填充配置文件,把配置文件和相关依赖文件导入到文件夹内合适的 首发于酷家乐前端博客,作者@摘星(segmentfault @StinsonZhao) 我们能从很多地方学习到怎么起一个 Electron 项目,有些还会介绍怎么打包或构建你的代码,但距离「真正地...
阅读 1660·2021-11-25 09:43
阅读 2754·2021-09-24 10:30
阅读 3781·2021-09-06 15:02
阅读 3698·2019-08-30 15:55
阅读 3369·2019-08-30 15:53
阅读 1777·2019-08-30 15:52
阅读 2217·2019-08-30 14:21
阅读 2084·2019-08-30 13:55