第Ⅰ章-V package.json文件详解

第Ⅰ章-Ⅰ 了解Vue3 创建一个Vue3项目
第Ⅰ章-Ⅱ Vue3自定义创建项目 项目文件详解
第Ⅰ章-III Vite 创建vue3 项目
第Ⅰ章-IV npm yarn pnpm 包管理器

第Ⅰ章-V package.json文件详解

  • 简洁
  • 详解
    • 基本字段
      • [name 定义项目名称](#name 定义项目名称)
      • [version 定义项目版本号](#version 定义项目版本号)
      • [description 对项目的简短描述](#description 对项目的简短描述)
      • [main 指定项目入口文件](#main 指定项目入口文件)
      • [scripts 定义一系列可以通过命令调用的脚本](#scripts 定义一系列可以通过命令调用的脚本)
      • [private npm将阻止这个项目被发布到npm registry。](#private npm将阻止这个项目被发布到npm registry。)
    • 依赖关系
      • [dependencies 项目在运行时需要的依赖包](#dependencies 项目在运行时需要的依赖包)
      • [devDependecies 开发时需要的依赖包,列入构建工具 测试框架](#devDependecies 开发时需要的依赖包,列入构建工具 测试框架)
      • [peerDependecies 项目期望运行环境中已经安装的包](#peerDependecies 项目期望运行环境中已经安装的包)
    • 高级字段
      • [engines 定义项目所需的Node.js或npm版本](#engines 定义项目所需的Node.js或npm版本)
      • [registory 提供项目的源码仓库信息](#registory 提供项目的源码仓库信息)
      • [licence 指定项目许可证类型](#licence 指定项目许可证类型)
      • [files 列出了发布到npm registry 时需要包含的文件目录](#files 列出了发布到npm registry 时需要包含的文件目录)
      • [keywords 为项目提供一些管检测](#keywords 为项目提供一些管检测)
    • 其他字段
      • [author 作者信息](#author 作者信息)
      • [bugs 提供问题报告的链接或电子邮件](#bugs 提供问题报告的链接或电子邮件)
      • [homepage 指定项目的主页链接](#homepage 指定项目的主页链接)

简洁

他是一个Node.js项目的核心文件,用于定义项目的元数据,依赖关系,脚本等。

详解

基本字段

name 定义项目名称

  • 必须时唯一的。并符合npm对名称的命名规则
  • 在发布到npm registry[^1] 时会用作包的标识符
json 复制代码
{
    "name":"my-vue"
}

\^1\] npm用来存储和管理软件包的几种式存储库 #### version 定义项目版本号 * 使用语义版本控制 如1.0.0 ```json { "version":"0.0.0" } ``` #### description 对项目的简短描述 * 这个描述会显示在npm registry上,也有助于其他开发者了解项目的用途 #### main 指定项目入口文件 * 在Node.js环境中运行require() 或 import 语句时,默认会加载这个文件。 #### scripts 定义一系列可以通过命令调用的脚本 * 常用的脚本包括 start(启动项目) test(运行测试) build(构建项目) preview(vite提供的轻量级预览服务器 预览) ```json { "scripts": { "dev": "vite", "build": "vue-tsc && vite build", "preview": "vite preview", "test":"jest" }, } ``` vite-tsc 这一步运行TypeScript编译器tsc #### private npm将阻止这个项目被发布到npm registry。 避免项目意外发布敏感或未准备好的项目到公共仓库 ### 依赖关系 ```json { "dependencies": { "vue": "^3.4.21" }, "devDependencies": { "@vitejs/plugin-vue": "^5.0.4", "typescript": "^5.2.2", "vite": "^5.2.0", "vue-tsc": "^2.0.6" } } ``` #### dependencies 项目在运行时需要的依赖包 * 在 npm i时自动安装 * 版本号可以指定具体版本或者控制版本范围 #### devDependecies 开发时需要的依赖包,列入构建工具 测试框架 * 这些包不会在生产环境中安装 #### peerDependecies 项目期望运行环境中已经安装的包 * 用于插件类包,确保主包和插件的兼容性 * npm 在安装时会提示用户检查并安装这些依赖 ### 高级字段 #### engines 定义项目所需的Node.js或npm版本 确保项目在Node.js12以上版本运行 ```json { "node":">=12.0.0" } ``` #### registory 提供项目的源码仓库信息 * 通常是Git仓库的地址 #### licence 指定项目许可证类型 * 列入MIT GPL 等 可以为用户提供项目的使用许可信息 #### files 列出了发布到npm registry 时需要包含的文件目录 * 可以避免不必要的文件包含在包中,从而减少包的大小 #### keywords 为项目提供一些管检测 * 可以帮助npm搜索发现相关项目 ### 其他字段 #### author 作者信息 #### bugs 提供问题报告的链接或电子邮件 #### homepage 指定项目的主页链接

相关推荐
white-persist31 分钟前
Python实例方法与Python类的构造方法全解析
开发语言·前端·python·原型模式
新中地GIS开发老师1 小时前
Cesium 军事标绘入门:用 Cesium-Plot-JS 快速实现标绘功能
前端·javascript·arcgis·cesium·gis开发·地理信息科学
Superxpang1 小时前
前端性能优化
前端·javascript·vue.js·性能优化
Rysxt_1 小时前
Element Plus 入门教程:从零开始构建 Vue 3 界面
前端·javascript·vue.js
隐含1 小时前
对于el-table中自定义表头中添加el-popover会弹出两个的解决方案,分别针对固定列和非固定列来隐藏最后一个浮框。
前端·javascript·vue.js
大鱼前端1 小时前
Turbopack vs Webpack vs Vite:前端构建工具三分天下,谁将胜出?
前端·webpack·turbopack
你的人类朋友2 小时前
先用js快速开发,后续引入ts是否是一个好的实践?
前端·javascript·后端
知识分享小能手2 小时前
微信小程序入门学习教程,从入门到精通,微信小程序核心 API 详解与案例(13)
前端·javascript·学习·react.js·微信小程序·小程序·vue
子兮曰2 小时前
npm workspace 深度解析:与 pnpm workspace 和 Lerna 的全面对比
前端·javascript·npm