基本概念
package.json 是 Node.js 项目的核心配置文件，包含了项目的元数据、依赖信息、脚本命令等关键配置。它是 npm/yarn/pnpm 等包管理器的基础。文件结构示例
{"name": "vue3-admin","private": true,"version": "0.0.0","type": "module","scripts": {"dev": "vite","build": "vue-tsc -b && vite build","preview": "vite preview"},"dependencies": {"vue": "^3.5.22"},"devDependencies": {"@types/node": "^24.10.0","@vitejs/plugin-vue": "^6.0.1","@vue/tsconfig": "^0.8.1","typescript": "~5.9.3","vite": "^7.1.7","vue-tsc": "^3.1.0"}
}
核心字段详解
项目元数据
入口与输出配置
依赖配置
脚本配置
"scripts": {"dev": "vite","build": "vue-tsc -b && vite build","preview": "vite preview"},
npm run dev 中的dev就是此处的key
引擎与环境配置
类型与模块配置
发布配置
版本号规则
语义化版本（SemVer）
major.minor.patch
- major: 不兼容的 API 变更
- minor: 向下兼容的功能性新增
- patch: 向下兼容的问题修正
版本范围符号
高级配置示例
条件导出
"exports": {".": {"import": "./dist/index.esm.js","require": "./dist/index.cjs.js","types": "./dist/index.d.ts"},"./utils": {"import": "./dist/utils.esm.js","require": "./dist/utils.cjs.js"}
}
工作区配置
"workspaces": ["packages/*","apps/*" ]
浏览器兼容性
"browserslist": ["> 1%","last 2 versions","not dead" ]
最佳实践
1 版本控制：将
package.json 加入版本控制2 依赖管理：- 定期更新依赖：
npm update - 检查安全漏洞：
npm audit - 使用精确版本：考虑使用
--save-exact3 脚本组织： - 使用有意义的脚本名称
- 利用 pre/post 钩子
- 保持脚本简洁，复杂逻辑抽离到单独文件
常见问题解决
# 修复依赖版本冲突 npm dedupe# 清理并重新安装 rm -rf node_modules package-lock.json && npm install# 检查依赖树 npm ls# 验证 package.json 格式 npm pkg validate
package.json 是前端项目的 "身份证" 和 "操作手册"，正确配置它对于项目的可维护性和稳定性至关重要。