https://fe-interview.pangcy.cn/tags/%E8%84%9A%E6%9C%AC%E9%92%A9%E5%AD%90/Recent content in 脚本钩子 on ZiYang FrontEnd InterviewHugoen-usThu, 06 Mar 2025 13:07:39 +0800https://fe-interview.pangcy.cn/docs/engineering/npm/npm-08/Wed, 05 Mar 2025 12:29:59 +0000https://fe-interview.pangcy.cn/docs/engineering/npm/npm-08/<h2 id="考察点分析">考察点分析 <a href="#%e8%80%83%e5%af%9f%e7%82%b9%e5%88%86%e6%9e%90" class="anchor" aria-hidden="true"><i class="material-icons align-middle">link</i></a></h2><p>本题主要考察以下能力维度：</p> <ol> <li><strong>npm生态理解</strong>：对Node.js包管理工具核心机制的理解深度</li> <li><strong>工程化实践</strong>：对前端工程化中构建/发布流程的掌控能力</li> <li><strong>脚本控制能力</strong>：对自动化工具链中关键节点的精准控制意识</li> </ol> <p>具体评估点：</p> <ul> <li>生命周期钩子的完整认知体系</li> <li>发布/安装流程中脚本执行顺序的掌握</li> <li>新版npm（v7+）与传统版本的区别理解</li> <li>安全风险防范意识（如postinstall潜在危险）</li> <li>预处理/后处理脚本的典型应用场景</li> </ul> <hr> <h2 id="技术解析">技术解析 <a href="#%e6%8a%80%e6%9c%af%e8%a7%a3%e6%9e%90" class="anchor" aria-hidden="true"><i class="material-icons align-middle">link</i></a></h2><h3 id="关键知识点">关键知识点 <a href="#%e5%85%b3%e9%94%ae%e7%9f%a5%e8%af%86%e7%82%b9" class="anchor" aria-hidden="true"><i class="material-icons align-middle">link</i></a></h3><p>生命周期阶段 &gt; 版本差异 &gt; 安全规范 &gt; 典型应用</p> <h3 id="核心机制">核心机制 <a href="#%e6%a0%b8%e5%bf%83%e6%9c%ba%e5%88%b6" class="anchor" aria-hidden="true"><i class="material-icons align-middle">link</i></a></h3><p>npm脚本通过约定前缀实现自动触发：</p> <ol> <li><strong>pre</strong> 前缀：主脚本执行前触发（如 <code>prebuild</code>）</li> <li><strong>post</strong> 前缀：主脚本执行后触发（如 <code>postbuild</code>）</li> </ol> <p>特殊生命周期钩子触发逻辑：</p> <table> <thead> <tr> <th>钩子名称</th> <th>触发场景</th> <th>版本变化影响</th> </tr> </thead> <tbody> <tr> <td>prepublish</td> <td>1. <code>npm publish</code> 前<br>2. <code>npm install</code>（无<code>node_modules</code>时）</td> <td>npm@7后仅在publish时触发</td> </tr> <tr> <td>prepublishOnly</td> <td>仅<code>npm publish</code>前执行</td> <td>替代旧版prepublish</td> </tr> <tr> <td>prepare</td> <td>1. <code>npm publish</code>前<br>2. 本地<code>npm install</code>（Git依赖）</td> <td>推荐构建入口</td> </tr> <tr> <td>postinstall</td> <td>包安装完成后</td> <td>CI/CD环境常用</td> </tr> <tr> <td>prepack</td> <td><code>npm pack</code>/<code>publish</code>前</td> <td>影响包内容验证</td> </tr> </tbody> </table> <h3 id="典型误区">典型误区 <a href="#%e5%85%b8%e5%9e%8b%e8%af%af%e5%8c%ba" class="anchor" aria-hidden="true"><i class="material-icons align-middle">link</i></a></h3><ol> <li>认为<code>prepublish</code>只与发布相关（实际旧版npm在安装时可能触发）</li> <li>混淆<code>prepare</code>与<code>prepublishOnly</code>的使用场景</li> <li>在<code>postinstall</code>中执行高危操作（如网络请求）</li> <li>未考虑脚本执行失败对主流程的影响</li> </ol> <hr> <h2 id="问题解答">问题解答 <a href="#%e9%97%ae%e9%a2%98%e8%a7%a3%e7%ad%94" class="anchor" aria-hidden="true"><i class="material-icons align-middle">link</i></a></h2><p>npm脚本生命周期分为<strong>默认阶段</strong>和<strong>扩展阶段</strong>，核心钩子触发逻辑如下：</p>