博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
npm script 命令补全的实现
阅读量:7086 次
发布时间:2019-06-28

本文共 1845 字,大约阅读时间需要 6 分钟。

不知不觉,脚本命令已经写了十来条,而且会越多(人的贪婪是无止境的),如果有自动补全机制该有多好啊,既然你我都能想到这个场景需要,npm 当然也会帮我做这类事情了。

列出所有命令

请记得前面查看显性变量列表 npm run env | grep npm_package | sort,这里在介绍一种更具体的显示命令集合的 shell npm run | less,简单剖析下,知道的童鞋自行跳过。

  • npm run, 列出 scripts 中的所有命令;
  • |, 管道操作符,可以理解 promise 的 then;
  • less,对文件或其它输出进行分页显示的工具,是linux正统查看文件内容的工具,功能极其强大。

执行后

如果你的命令比较多的话,可以用鼠标向下方向键或空格,翻页以查看更多,这就是 less 的强大。同时,你可以输入 / 进行关键字搜索。

实现自动补全

开头说了 npm 有自动补全工具,就是 ,把它集成到 或 ,集成方法如下

npm completion >> ~/.zshsource ~/.zshrc复制代码

解释下上面两条命令

  • 第一条是把 npm completion 输出添加到 ~/.bashrc 文件中(可理解为声明函数);
  • 第二条是让第一条生效(执行上面声明的函数);

注:mac 预装了 zsh, 如果没有安装 zsh , 可安装下

zsh --version // 查看否安装了zsh命令行sudo apt-get install zsh // 安装zsh复制代码

验收

输入 npm runrun 后面有空格(论空格的重要性),然后用你的左手小指点下 tab

来点更加智能的、更加人性化的

1.先介绍主角(一个插件)。在下载之前,我们先安装 oh-my-zsh,然后 clone zsh-better-npm-completion 代码到 .oh-my-zsh 自定义插件库

// 打开命令行安装curl -fsSL https://raw.github.com/robbyrussell/oh-my-zsh/master/tools/install.sh | sh // 克隆 zsh-better-npm-completiongit clone https://github.com/lukechilds/zsh-better-npm-completion ~/.oh-my-zsh/custom/plugins/zsh-better-npm-completion复制代码

2.在添加插件前,本着一个好习惯,先克隆一份 .zshrc,然后设置默认 shell 为 zsh

cp ~/.zshrc ~/.zshrc.backchsh -s /bin/zsh复制代码

3.执行 .zshrc

vim ~/.zshrc// 在最后一行添加source ~/.oh-my-zsh/custom/plugins/zsh-better-npm-completion/zsh-better-npm-completion.plugin.zsh// 启用插件,多插件空格分开plugins = (zsh-better-npm-completion);// 查看 .oh-my-zsh 插件ls ~/.oh-my-zsh/plugins复制代码

注:

卸载 oh my zsh 可运行 uninstall_oh_my_zsh;

自动更新 oh my zsh 可在 .zshrc 中添加 DISABLE_UPDATE_PROMPT=true;

自动更新 oh my zsh 可运行 upgrade_oh_my_zsh;

再进一步,设置好看主题

下载 iTerm 2

下载地址:

更换主题

// 打开.zshrc文件open ~/.zshrc// 修改主题ZSH_THEME="agnoster"// 保存重新打开 iTerm 2复制代码

下载 Powerline fonts 字体并安装

// clonegit clone https://github.com/powerline/fonts.git --depth=1cd fonts./install.shcd ..rm -rf fonts复制代码

设置背景

最终成果

推荐插件

更多插件可参考

You can

转载于:https://juejin.im/post/5cf47f105188253a2b01c981

你可能感兴趣的文章
python win32api 使用小技巧
查看>>
tableWidget单元格的大小调整
查看>>
Linux平台gcc和动态共享库的基础知识
查看>>
Compilify——让你在浏览器中编译.NET代码
查看>>
【原】JavaScript中Date对象的getYear()和getFullYear()的区别
查看>>
j2ee程序员应该掌握的linux知识(转)
查看>>
Android_文档学习_UI_creating menus
查看>>
Hibernate问题之'hibernate.dialect' not set
查看>>
8月8日小记
查看>>
u-boot中环境变量的实现
查看>>
Android开发之Button事件实现方法的总结
查看>>
Squid调试和故障处理
查看>>
MIME protocol 说明
查看>>
Google LOGO现代舞舞蹈动画
查看>>
<context:component-scan>配置解析(转)
查看>>
poj 2041 Unreliable Message 字符串处理
查看>>
有人3见解
查看>>
[python]decimal常用操作和需要注意的地方
查看>>
Ubuntu 网卡信息2
查看>>
android 没有main函数,怎么找到程序执行入口呢?以及activity主要生命周期的方法说明...
查看>>