package.json 文件详解（图解版）

一、package.json 概述

package.json 是 Node.js 项目的配置文件，也是 npm 包管理器的核心文件。它包含了项目的元数据、依赖信息、脚本命令等重要配置。

二、文件结构层级

三、核心字段详解

基本信息字段流程

四、脚本命令工作流

五、完整配置示例与说明

5.1 Vue 3 项目完整配置

{
  // === 基本信息 ===
  "name": "vue3-project",              // 项目名称（必填）
  "version": "1.0.0",                  // 版本号（必填）
  "private": true,                     // 私有项目，不发布到 npm
  "description": "Vue 3 学习项目",      // 项目描述
  "author": "Your Name",               // 作者信息
  "license": "MIT",                    // 开源协议
  
  // === 模块类型 ===
  "type": "module",                    // ESM 模块
  
  // === 脚本命令 ===
  "scripts": {
    "dev": "vite",                     // 开发服务器
    "build": "vite build",             // 生产构建
    "preview": "vite preview",         // 预览构建结果
    "lint": "eslint src --fix",        // 代码检查
    "format": "prettier --write src"   // 代码格式化
  },
  
  // === 生产依赖 ===
  "dependencies": {
    "vue": "^3.3.4",                   // Vue 3 框架
    "vue-router": "^4.2.4",            // 路由
    "pinia": "^2.1.6"                  // 状态管理
  },
  
  // === 开发依赖 ===
  "devDependencies": {
    "@vitejs/plugin-vue": "^4.2.3",    // Vite Vue 插件
    "vite": "^4.4.5",                  // 构建工具
    "eslint": "^8.49.0",               // 代码检查
    "prettier": "^3.0.3"               // 代码格式化
  }
}