背景

项目中少不了使用npm，因为我们需要node_module包，项目才能正常运行调试，但是在此之前，对于npm，我只知道npm start/npm build等之类的命令行，除此之外我就没有了解。在一次需求git commit 前对代码中做一些处理处理，不符合条件就不允许git commit，只有符合条件才能commit。在实现这个需求的时候开始了一系列探索，知道了如何写一个简单的eslint自定义规则，知道了husky，package.json 里面的一些字段的意思，首先我想先说说npm

从package开始说起

先来了解一下package.json 文件里面每一行代码的大概作用

当我们在运行项目或者打包项目的时候用的是npm xxx 而xxx就是在 script 里面定义的。那么问题来了 npm 的原理是什么呢？

npm 原理

npm 就是node 的包管理和分发工具node模块的标准，js的运行环境

每当执行npm run，就会自动新建一个 Shell，在这个 Shell 里面执行指定的脚本命令。npm run新建的这个 Shell，会将当前目录的node_modules/.bin子目录加入PATH变量，执行结束后，再将PATH变量恢复原样。

这意味着，当前目录的node_modules/.bin子目录里面的所有脚本，都可以直接用脚本名调用，而不必加上路径。比如，当前项目的依赖里面有 Mocha，只要直接写mocha test就可以了。

"test": "mocha test"

而不用写成下面这样。

"test": "./node_modules/.bin/mocha test"

注意了：

"lint": "jshint *.js"
"lint": "jshint **/*.js"
"test": "tap test/\*.js"

*表示任意文件名，**表示任意一层子目录。如果要将通配符传入原始命令，防止被 Shell 转义，要将星号转义

npm run start的默认值是node server.js，前提是项目根目录下有server.js这个脚本；

npm run install的默认值是node-gyp rebuild，前提是项目根目录下有binding.gyp文件。

npm 的钩子

之前说在做 git commit 提交验证拦截验证的时候，在package.json的”scripts”:{}里面里面有一句 “postinstall”: “husky install” 她的意思就是在你运行了 npm install 之后，会自动给你运行的一个脚本，这个脚本是启用 git hooks

npm 脚本有pre和post两个钩子。

举例来说: install脚本命令的钩子就是preinstall和postinstall。

build脚本命令的钩子就是prebuild和postbuild。

其实我们在执行 npm install 其实是两个钩子函数的集合，npm preinstall 和npm postinstall的集合

你知道npx 和 npm的区别吗？

简单说：npx 是一个临时安装，用完后删除，npm一个永久存在，用需要全局安装的东西npx会更好些。详细内容请参考 npx 使用教程

如何优雅的修改第三方依赖？

从事前端这么多年了，第一次知道，原来使用pnpm patch实现，是如此便捷方便

第一步

pnpm patch 你要修改的包

第二步

打开控制台提示的文件 xxx

第三步

pnpm patch-commit xxx

完成之后你会发现在项目目录下看到，生成了一个patches文件夹，里面包含了一个修改记录，同时在package.json中多了一个配置项。

  "pnpm": {
    "patchedDependencies": {
      "xxx": "xx.patch"
    }
  }

对此完成第三方依赖的修改了

如何优雅的修改第三方依赖？（pnpm patch实现）

总结

因为"postinstall": "husky install" 一句话知道了 npm 运行的原理+npm的钩子函数，get到了，接下来就是husky和git hooks的一些东西了。

参考文章

剖析npm的包管理机制（完整版）

npm scripts 使用指南