全栈程序员-前端第一节-npm 是什么？

npm = Node Package Manager（Node 包管理器）

简单理解

npm 是 JavaScript/Node.js 的包管理工具，用于：

安装和管理 JavaScript 库/工具

管理项目依赖

运行项目脚本

类比理解

npm ≈ Python 的 pip、Java 的 Maven、Go 的 go mod

npm 仓库 ≈ 应用商店（存放各种 JavaScript 包）

npm 的主要功能

1. 安装包

复制代码

npm install vite        # 安装 vite 包
npm install react       # 安装 react 库
npm install -D typescript  # 安装开发依赖（-D 表示 devDependencies）

2. 管理项目依赖

项目中的 package.json 文件记录依赖：

复制代码

{
  "name": "my-project",
  "dependencies": {
    "react": "^18.0.0",      // 生产依赖
    "vite": "^5.0.0"
  },
  "devDependencies": {
    "typescript": "^5.0.0"   // 开发依赖
  }
}

3. 运行脚本

在 package.json 中定义脚本：

复制代码

{
  "scripts": {
    "dev": "vite",
    "build": "vite build"
  }
}

然后运行：

npm run dev # 执行 scripts.dev 中的命令

npm run build # 执行 scripts.build 中的命令

npm 的组成部分

npm 命令行工具：安装 Node.js 时自带

npm 仓库：https://www.npmjs.com（全球最大的 JavaScript 包仓库）

package.json：项目配置文件

node_modules：存放已安装的包

常见 npm 命令

复制代码

npm install          # 安装 package.json 中的所有依赖
npm install <包名>    # 安装指定包
npm uninstall <包名>  # 卸载包
npm run <脚本名>      # 运行 package.json 中的脚本
npm init             # 初始化项目，创建 package.json
npm list             # 查看已安装的包
npm update           # 更新包

npm 与 Node.js 的关系

Node.js：JavaScript 运行时环境

npm：Node.js 自带的包管理器

安装 Node.js 时会自动安装 npm

实际例子

当你创建一个前端项目时：

复制代码

# 1. 初始化项目
npm init -y

# 2. 安装 Vite
npm install -D vite

# 3. 在 package.json 中添加脚本
# "scripts": { "dev": "vite" }

# 4. 运行开发服务器
npm run dev

文件位置：package.json

它们位于 package.json 文件的 scripts 字段中。示例：

复制代码

{
  "name": "@vitejs/test-wasm",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {                    ← scripts 字段开始
    "dev": "vite",                ← "dev" 在这里，第 7 行
    "build": "vite build",        ← "build" 在这里，第 8 行
    "preview": "vite preview"
  }                               ← scripts 字段结束
}

下一节vite学习全栈程序员-前端第二节- vite是什么？-CSDN博客