前端必备,从零开始完成一个node命令行工具

这篇博客介绍了如何使用Node.js创建命令行工具。首先,通过创建文件、初始化项目和设置`package.json`的`bin`字段来构建工具。然后,通过在`index.js`中添加代码并使用shebang行指定解释器。最后,通过`npm link`将工具链接到本地环境,使其可执行。博客还解释了环境变量的用途,以及如何访问命令行参数。
摘要由CSDN通过智能技术生成

前言

node.js 作为一种服务器语言,其拥有很多底层操作的api,比如文件写入,http服务器等模块。同时其语法和js几乎一直,所以作为前端的我们,可以运用这些东西帮助解决一些开发中的实际问题。

前置知识

  • 每当shell新开启一个会话时,shell都会生成environment即环境变量,environment里都是些定义系统属性的变量。命令行输入 env即可查看环境变量

在这里插入图片描述

  • 很多程序都会用到这里的变量,比如nvm会用这里的NVM_NODEJS_ORG_MIRROR=https://nodejs.org/dist
    作为代理服务器地址,去镜像的源下载node来安装,提高速度

  • 查看全局包安装在哪里 npm root -g

  • 当我们shell里执行node x.js --args,args可以通过process.argv来访问,process.argv[0]固定是node本身路径,process.argv[1]是文件路径,process.argv.slice(2)才是我们输入的参数

node工具如何创建

  1. 首先创建一个文件 mkdir test
  2. cd test 进入文件夹
  3. 初始化我们的项目 npm init,一路回车就好,此时应该有一个package.json的文件
  4. 用一款你喜欢的开发工具打开test文件夹
    此时你看到的应该是这样
    在这里插入图片描述
    到这里就算项目创建好啦~

如何配置命令

对 node 项目而言,模块导出入口文件由 package.json 的 main 字段指定
而如果是要安装到命令行的工具,则是由 package.json 的 bin 字段指定。

首次创建的package.json文件应该长成这样(如果你是一路按回车键的话)
在这里插入图片描述

然后我们应该给它配置一个bin字段,如下所示
在这里插入图片描述

这个的意思是,我们创建了一个test-abc命令,当你输入这个命令的时候,执行同级目录下的index.js文件。

所以我们现在就需要在index.js文件下写我们需要的代码逻辑

正式开发工具

创建index.js文件。现在的文件结构应该是:
在这里插入图片描述

在index.js中写下:

#!/usr/bin/env node
console.log("test-abc");

第一行是脚本声明文件。任何以shebang line(#!)
开头的文件即是可执行的脚本,其中shebang line指定了用什么(解释器)来解释执行脚本

比如常见的python脚本,你可以看到第一行是这样的:
#!/usr/bin/env python

node.js来说,shebang line通常这么写:
#!/usr/bin/env node

Shebang是为了指定脚本的解释程序,可是不同用户或者不同的脚本解释器有可能安装在不同的目录下,系统如何知道要去哪里找你的解释程序呢? /usr/bin/env就是告诉系统可以在PATH目录(即 /usr/bin/env)中查找。所以配置#!/usr/bin/env node, 就是解决了不同的用户node路径不同的问题,可以让系统动态的去查找node来执行你的脚本文件。

如何执行node命令

直接命令行输入我们定义的命令名称就好啦。这里我们定义的test-abc ,所以直接输入test-abc就好啦~

然后我们测试一下,在终端中输入 kid,会提示:

zsh: command not found: kid

为什么会这样呢?回想一下,通常我们在使用一个 cli 工具时,都需要先安装它,比如 vue-cli,使用前需要全局安装:

npm i vue-cli -g

而我们的 kid-cli 并没有发布到 npm 上,当然也没有安装过了,所以终端现在还不认识这个命令。通常我们想本地测试一个 npm 包,可以使用:npm link 这个命令,本地安装这个包,我们执行一下:

npm link

然后再执行

test-abc

就会看输出 ‘test-abc‘ 啦
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值