---
url: /article/xb4woxjg/index.md
---
## 浏览器插件

* [Vue.js devtools](https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?) 顾名思义，非常有用的浏览器 vue开发调试插件
* [React Developer Tools](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) React 开发调试插件
* [Octotree - GitHub code tree](https://chrome.google.com/webstore/detail/octotree-github-code-tree/bkhaagjahfmjljalopjnoealnfndnagc) 对github仓库的文件tree生成侧边栏，方便在线查阅浏览/跳转
* [XPath Helper](https://chrome.google.com/webstore/detail/xpath-helper/hgimnogjllphhhkhlmebbmlgjoejdpjl) 提取当前网站选中的 DOM 元素的 XPath，做埋点测试之类时有用

## cli开发

* [commander](https://www.npmjs.com/package/commander) 完整的命令行解决方案
* [cac](https://www.npmjs.com/package/cac) 轻量级的用于构建cli工具的解决方案

***

* [minimist](https://www.npmjs.com/package/minimist) 命令行参数解析工具
* [yargs](https://www.npmjs.com/package/yargs) 命令行参数解析工具

***

* [Inquirer](https://www.npmjs.com/package/inquirer) 交互式命令行工具
* [prompt](https://www.npmjs.com/package/prompt) 命令行 对话工具

***

* [shelljs](https://www.npmjs.com/package/shelljs) shell调用工具

* [execa](https://www.npmjs.com/package/execa) shell 调用工具

* [chalk](https://www.npmjs.com/package/chalk) node终端输出美化工具

* [ora](https://www.npmjs.com/package/ora) 终端 loading 工具

* [chokidar](https://www.npmjs.com/package/chokidar) 文件监听工具

* [is-ci](https://www.npmjs.com/package/is-ci) 检查当前环境是否是集成环境

## Http server

* [express](http://expressjs.com/)
* [connect](https://github.com/senchalabs/connect)
* [koa](https://koajs.com/)
* [fastify](https://www.fastify.io/)

## Server Framework

* [Nestjs](https://nestjs.com/) 类Spring boot的 Node端开发框架

* [Next.js](https://nextjs.org/) React 应用开发框架

* [Nuxt.js](https://nuxtjs.org/) Vue 应用开发框架

* [Think.js](https://thinkjs.org/) Node端开发框架

* [Egg.js](https://www.eggjs.org/index) 阿里开源的Node端开发框架

## VSCode 插件

### 皮肤

* [One Dark Pro](https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme) 个人觉得非常耐看，好用，舒服的一个皮肤。
* [Material Icon Theme](https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme) 非常全面又好看的文件图标主题

### 辅助开发

* [IntelliCode](https://marketplace.visualstudio.com/items?itemName=VisualStudioExptTeam.vscodeintellicode) 辅助代码提示
* [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) 拼写检查插件
* [Error Lens](https://marketplace.visualstudio.com/items?itemName=usernamehw.errorlens) 用更友好更直观的方式，将错误信息显示出来
* [Better Comments](https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments) 更加友好的注释高亮
* [Bracket Pair Colorizer](https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer) 代码缩进高亮
* [Import Cost](https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost) 显示包体积
* [Todo Tree](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree) TODO注释高亮
* [indent-rainbow](https://marketplace.visualstudio.com/items?itemName=oderwat.indent-rainbow) 缩进高亮标识
* [Path Intellisense](https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense) 文件路径提示
* [TypeScript Hero](https://marketplace.visualstudio.com/items?itemName=rbbit.typescript-hero) typescript 辅助开发工具

***

* [any-rule](https://marketplace.visualstudio.com/items?itemName=russell.any-rule) 正则表达式大全

***

* [Rest Client](https://marketplace.visualstudio.com/items?itemName=humao.rest-client) 类 Postman 的 Rest工具

## 测试工具

### assertion

* [chai](https://www.npmjs.com/package/chai)
* [should](https://www.npmjs.com/package/should)

### unit

* [jest](https://www.npmjs.com/package/jest)
* [ava](https://www.npmjs.com/package/ava)
* [mocha](https://www.npmjs.com/package/mocha)
* [karma](https://www.npmjs.com/package/karma)
* [tape](https://www.npmjs.com/package/tape)
* [@vue/test-utils](https://www.npmjs.com/package/@vue/test-utils)

### 2e2

* [nightwatch](https://www.npmjs.com/package/nightwatch)
* [cypress](https://www.npmjs.com/package/cypress)

## GIT相关

* [@commitlint/cli](https://www.npmjs.com/package/@commitlint/cli)
* [@commitlint/config-conventional](https://www.npmjs.com/package/@commitlint/config-conventional)
* [commitizen](https://www.npmjs.com/package/commitizen)
* [conventional-changelog-cli](https://www.npmjs.com/package/conventional-changelog-cli)
* [cz-conventional-changelog](https://www.npmjs.com/package/cz-conventional-changelog)
* [husky](https://www.npmjs.com/package/husky)
* [lint-staged](https://www.npmjs.com/package/lint-staged)

## 其他

* [Slidev](https://github.com/slidevjs/slidev) 为开发者打造的演示文稿工具
* [loupe](http://latentflip.com/loupe/) 代码执行流程可视化