npm 全面详解
1. npm 是什么？
1.1 基本定义
1.2 npm 的重要性
2. npm 的安装和配置
2.1 安装 npm
2.2 npm 配置
3. package.json 文件详解
3.1 文件结构
3.2 版本号语义化
4. 依赖管理命令
4.1 安装依赖
4.2 依赖操作
4.3 依赖类型详解
5. 脚本管理（npm scripts）
5.1 常用脚本示例
5.2 脚本执行和组合
6. 包发布和管理
6.1 创建和发布包
6.2 包管理最佳实践
7. 工作区和 Monorepo
7.1 工作区配置
7.2 工作区命令
8. 安全相关命令
8.1 安全审计
8.2 依赖安全检查
9. 性能优化和缓存
9.1 缓存管理
9.2 安装优化
10. 故障排除和调试
10.1 常见问题解决
10.2 调试技巧
11. 实际工作流示例
11.1 新项目初始化流程
11.2 团队协作规范
12. 高级特性和技巧
12.1 Hook 脚本
12.2 环境变量和配置
12.3 自定义注册表
13. 与其他工具集成
13.1 与 CI/CD 集成
13.2 与 Docker 集成
总结

npm 全面详解

1. npm 是什么？

1.1 基本定义

npm（Node Package Manager）是 JavaScript 的包管理工具，也是世界上最大的软件注册表。它包含三个组成部分：

注册表（Registry）：存储 JavaScript 包的数据库
网站（Website）：查找包的 Web 界面
命令行工具（CLI）：与注册表交互的工具

1.2 npm 的重要性

# npm 在 JavaScript 生态中的核心地位
- 超过 200 万个包可供使用
- 每周下载量超过 300 亿次
- Node.js 的默认包管理器
- 现代前端开发的必备工具

2. npm 的安装和配置

2.1 安装 npm

# npm 随 Node.js 一起安装
# 下载 Node.js 即可获得 npm
node --version  # 检查 Node.js 版本
npm --version   # 检查 npm 版本

# 更新 npm 到最新版本
npm install -g npm@latest

# 在特定项目中更新 npm
npm install npm@latest

2.2 npm 配置

# 查看当前配置
npm config list

# 查看全局配置
npm config list -l

# 设置配置项
npm config set registry https://registry.npmmirror.com  # 使用淘宝镜像
npm config set save true          # 自动保存依赖
npm config set save-exact true    # 保存精确版本

# 常用配置项
npm config set init-author-name "Your Name"
npm config set init-author-email "your@email.com"
npm config set init-license "MIT"

# 恢复默认配置
npm config delete registry

3. package.json 文件详解

3.1 文件结构

{
  "name": "my-project",
  "version": "1.0.0",
  "description": "项目描述",
  "main": "index.js",
  "scripts": {
    "start": "node index.js",
    "dev": "nodemon index.js",
    "test": "jest"
  },
  "dependencies": {
    "vue": "^2.6.14",
    "axios": "^0.21.1"
  },
  "devDependencies": {
    "webpack": "^5.0.0",
    "eslint": "^7.0.0"
  },
  "keywords": ["vue", "javascript"],
  "author": "Your Name",
  "license": "MIT",
  "repository": {
    "type": "git",
    "url": "https://github.com/user/repo.git"
  }
}

3.2 版本号语义化

{
  "dependencies": {
    // 精确版本号
    "vue": "2.6.14",

    // 兼容版本（允许补丁版本更新）
    "axios": "~0.21.1",  // 0.21.x

    // 允许次版本更新
    "react": "^17.0.2",   // 17.x.x

    // 最新版本
    "lodash": "*",

    // Git 仓库
    "my-package": "github:user/repo",

    // 本地路径
    "local-pkg": "file:../local-package",

    // 标签版本
    "beta-pkg": "1.0.0-beta.1"
  }
}

4. 依赖管理命令

4.1 安装依赖

# 安装生产依赖
npm install package-name
npm install vue vue-router vuex

# 安装开发依赖
npm install --save-dev package-name
npm install -D webpack eslint

# 安装全局包
npm install -g @vue/cli
npm install -g create-react-app

# 安装指定版本
npm install vue@2.6.14
npm install react@^16.8.0

# 从不同源安装
npm install git+https://github.com/user/repo.git
npm install ../local-package

4.2 依赖操作

# 查看已安装的包
npm list
npm list --depth=0        # 只看顶层依赖
npm list package-name     # 查看特定包

# 更新包
npm update
npm update package-name
npm update --save-dev

# 卸载包
npm uninstall package-name
npm uninstall -g package-name
npm remove package-name   # 简写

# 检查过时的包
npm outdated

4.3 依赖类型详解

# 生产依赖（dependencies）- 项目运行所需
npm install axios --save
npm i axios -S

# 开发依赖（devDependencies）- 仅开发所需
npm install eslint --save-dev
npm i eslint -D

# 对等依赖（peerDependencies）- 宿主环境提供
# 在 package.json 中手动添加
{
  "peerDependencies": {
    "react": ">=16.8.0"
  }
}

# 可选依赖（optionalDependencies）- 非必需
npm install optional-package --save-optional

5. 脚本管理（npm scripts）

5.1 常用脚本示例

{
  "scripts": {
    // 基本脚本
    "start": "node server.js",
    "dev": "nodemon server.js",

    // 构建相关
    "build": "webpack --mode production",
    "build:dev": "webpack --mode development",
    "build:analyze": "webpack --mode production --analyze",

    // 测试相关
    "test": "jest",
    "test:watch": "jest --watch",
    "test:coverage": "jest --coverage",

    // 代码质量
    "lint": "eslint src/**/*.js",
    "lint:fix": "eslint src/**/*.js --fix",
    "format": "prettier --write src/**/*.js",

    // 部署相关
    "predeploy": "npm run build",
    "deploy": "gh-pages -d dist",

    // 生命周期脚本
    "prestart": "npm run build",
    "postinstall": "node scripts/setup.js"
  }
}

5.2 脚本执行和组合

# 运行脚本
npm run script-name
npm start          # start 和 test 可以省略 run
npm test

# 传递参数给脚本
npm run build -- --mode production
npm run lint -- --fix

# 组合运行脚本
npm run build && npm test
npm run lint; npm run test

# 查看所有可用脚本
npm run

6. 包发布和管理

6.1 创建和发布包

# 初始化新包
npm init
npm init -y        # 使用默认配置

# 登录 npm
npm login
npm whoami         # 检查登录状态

# 发布包
npm publish
npm publish --access public  # 发布公共包

# 更新版本号
npm version patch           # 修订版本 1.0.0 -> 1.0.1
npm version minor           # 次版本 1.0.0 -> 1.1.0  
npm version major           # 主版本 1.0.0 -> 2.0.0

# 撤销发布（72小时内有效）
npm unpublish package-name@version

6.2 包管理最佳实践

# 添加标签
npm dist-tag add package-name@1.0.0 beta

# 查看包信息
npm info package-name
npm view package-name versions

# 下载统计
npm stats package-name

# 搜索包
npm search keyword
npm search vue --limit=10

7. 工作区和 Monorepo

7.1 工作区配置

{
  "name": "my-monorepo",
  "workspaces": [
    "packages/*",
    "apps/*"
  ],
  "private": true
}

7.2 工作区命令

# 在工作区根目录安装依赖
npm install

# 为特定工作区安装依赖
npm install package-name -w packages/my-package

# 在工作区中运行脚本
npm run dev --workspace=packages/my-package
npm run build --workspaces  # 所有工作区

# 添加新工作区
mkdir packages/new-package
cd packages/new-package
npm init -y

8. 安全相关命令

8.1 安全审计

# 检查安全漏洞
npm audit
npm audit --json          # JSON 格式输出
npm audit --production    # 只检查生产依赖

# 修复漏洞
npm audit fix
npm audit fix --force     # 强制修复（可能破坏兼容性）

# 忽略特定漏洞
npm audit fix --only=prod

8.2 依赖安全检查

# 检查许可证
npx license-checker
npx license-checker --summary

# 检查已知漏洞
npx snyk test
npx snyk wizard

# 包签名验证
npm ci --audit
npm install --package-lock-only

9. 性能优化和缓存

9.1 缓存管理

# 查看缓存信息
npm cache verify
npm cache ls

# 清理缓存
npm cache clean --force

# 修改缓存路径
npm config set cache /path/to/cache

9.2 安装优化

# 使用 ci 命令（用于 CI/CD）
npm ci           # 比 npm install 更快更可靠

# 忽略可选依赖
npm install --no-optional

# 仅安装生产依赖
npm install --production
npm install --only=prod

# 扁平化 node_modules（减少嵌套）
npm install --legacy-bundling

10. 故障排除和调试

10.1 常见问题解决

# 清除并重新安装
rm -rf node_modules package-lock.json
npm install

# 检查网络连接
npm ping
npm config get registry

# 查看详细日志
npm install --verbose
npm run build --verbose

# 检查权限问题
npm config get prefix
sudo npm install -g package-name  # 不推荐，尽量用 nvm

10.2 调试技巧

# 使用不同日志级别
npm install --loglevel silly
npm install --loglevel verbose
npm install --loglevel http

# 分析包大小
npx webpack-bundle-analyzer
npx source-map-explorer

# 检查循环依赖
npx madge --image deps.svg src/

11. 实际工作流示例

11.1 新项目初始化流程

# 1. 创建项目目录
mkdir my-project && cd my-project

# 2. 初始化 package.json
npm init -y

# 3. 安装依赖
npm install vue vue-router vuex
npm install -D webpack webpack-cli webpack-dev-server
npm install -D eslint @babel/core @babel/preset-env

# 4. 配置脚本
# 在 package.json 中添加 scripts

# 5. 开发
npm run dev

# 6. 构建
npm run build

# 7. 测试
npm test

11.2 团队协作规范

# 使用精确版本号
npm config set save-exact true

# 生成 package-lock.json
npm install

# 定期更新依赖
npm outdated
npm update

# 安全检查
npm audit
npm audit fix

# 使用 nvm 管理 Node.js 版本
nvm use 16
echo "16.0.0" > .nvmrc

12. 高级特性和技巧

12.1 Hook 脚本

{
  "scripts": {
    "preinstall": "node check-node-version.js",
    "postinstall": "node scripts/setup.js",
    "prepublishOnly": "npm test && npm run build",
    "preversion": "npm test",
    "postversion": "git push && git push --tags"
  }
}

12.2 环境变量和配置

# 使用环境变量
NODE_ENV=production npm run build
npm run build --mode=production

# 跨平台环境变量
npm install -D cross-env
# package.json
"build": "cross-env NODE_ENV=production webpack"

12.3 自定义注册表

# 使用私有注册表
npm config set registry http://registry.company.com
npm config set //registry.company.com/:_authToken token123

# 使用作用域包
npm install @company/package-name
npm publish --access public  # 发布公共作用域包

13. 与其他工具集成

13.1 与 CI/CD 集成

# GitHub Actions 示例
name: CI
on: [push]
jobs:
  test:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v2
    - uses: actions/setup-node@v2
      with:
        node-version: '16'
        cache: 'npm'
    - run: npm ci
    - run: npm test
    - run: npm run build

13.2 与 Docker 集成

FROM node:16-alpine
WORKDIR /app
COPY package*.json ./
RUN npm ci --only=production
COPY . .
EXPOSE 3000
CMD ["npm", "start"]

总结

npm 是现代 JavaScript 开发的基石，掌握 npm 的使用对于任何 JavaScript 开发者都至关重要。从简单的依赖管理到复杂的 Monorepo 项目，npm 提供了强大的工具链来支持各种开发场景。

关键要点：

理解 package.json 的结构和作用
掌握依赖版本管理的最佳实践
熟练使用 npm scripts 自动化工作流
重视安全审计和性能优化
适应团队协作的开发规范

通过合理使用 npm，可以大大提高开发效率，保证项目质量，并促进团队协作。

npm 简介