npm run start 的时候发生了什么

笔者最近真的不知道可以写一些什么文章,于是打算整理一些自己听过但基本没详细了解过的老八股,希望能够对各位有所帮助。

1.读取package.json文件

npm会首先读取项目的package.json文件,该文件包含了项目的配置信息和依赖项。

我们可以简单看看 package.json 文件的格式:

json 复制代码
"scripts": {
  "start": "node index.js",
  "dev": "nodemon",
  "lint": "eslint **/*.js"
}

2. 查找脚本命令

package.json文件中,npm会查找scripts字段下的start命令,以确定要执行的具体操作。

我们可以看到,当我们找到 start 命令的时候,我们会单纯执行 node index.js,然后跑起来我们的项目。

那么这里会有一个问题:为什么我们不直接执行 node index.js 呢?

  1. 由于 node 我们已经安装在电脑里面了,所以上面两个命令其实没啥区别,你非要用 node index.js 也是可以的。但是有时候有一些命令没有全局安装的时候,例如第二条命令的 eslint **/*.js 。你直接执行就会报错。
ts 复制代码
eslint **/*.js
// 报错
bash: eslint: command not found
  1. 那为什么 npm run lint 就可以顺利执行呢。为了解答这个问题,我们来看看 node_modules 文件夹的.bin 目录,这个目录下的文件,都是一些软链接,打开文件可以看到文件顶部写着 #!/bin/sh ,表示这是一个脚本。所以 npm run 执行的时候,当全局没有安装相关命令的时候,就会到这里去查找。

由此我们可以知道,当使用 npm run test 执行 eslint **/*.js 时,虽然没有全局安装 eslint 的全局命令,但是 npm 会到 ./node_modules/.bin 中找到 eslint 文件作为脚本来执行,则相当于执行了 ./node_modules/.bin/eslint **/*.js

而如果我们想不用软链接的方式,直接使用全局安装的命令的话,我们就需要在安装包的时候,使用npm install -g xxx来安装这个依赖,那么就会将xxx其中的bin文件加入到全局中;这样就可以和node一样,直接使用诸如xxx build这样的命令了。

3. 安装依赖

如果项目依赖其他包或库,npm会检查并确保所有依赖都已安装。如果有缺失的依赖,它会自动安装它们。

4. 执行命令 :一旦所有依赖都准备好,npm会执行start脚本中定义的命令。

这通常是一个启动开发服务器的命令,如webpack-dev-serverreact-scripts start

5. 启动开发服务器

该命令会启动一个开发服务器,该服务器将提供热重载(hot reloading)功能,以便在代码更改时实时更新应用程序。

相关推荐
软件聚导航9 小时前
「聚小软 AI 助手」技术升级:从数据库检索到 RAG 知识库问答
前端·数据库·mysql·微信小程序·小程序·ai编程·rag
恋猫de小郭10 小时前
看懂大模型架构术语,帮助你理解目前常见的大模型开源架构
前端·人工智能·ai编程
yma1610 小时前
通过提示词实现GitHub Pages 和 Nginx 双部署竟然这么简单?
前端
可乐鸡翅yeah_10 小时前
hls.js 内存泄漏实战排查,直播 M3U8 长时间播放异常定位方案
开发语言·javascript·python·django·ecmascript·m3u8·m3u8在线
前端 贾公子10 小时前
第09章:上下文与记忆 (2)
java·服务器·前端
可乐鸡翅yeah_10 小时前
第三方接口对接 M3U8 流媒体排坑实战,解决外部服务商流兼容难题
前端·javascript·python·django·html·m3u8·m3u8在线
GoppViper10 小时前
RDF资源描述框架深度解析:语义Web的数据基石与实战逻辑
前端·数据库
郑州光合科技余经理10 小时前
本地生活服务系统:模块边界与结算字段怎么拆
java·开发语言·前端·后端·系统架构·uni-app·php
IT_陈寒11 小时前
Vue的嵌套组件竟然吃掉了我的事件?
前端·人工智能·后端
默_笙11 小时前
🏠 「LLM Notes」:我用 Next.js + Redis 给自己造了个笔记博客
前端·javascript