学习搭建Vue组件库

version

version 字段表示包的版本号,大致符合 x.x.x 的格式,严格来说应该叫 major.minor.patch(主版本号.次版本号.修订号),如果要进一步了解版本号相关的知识,我们可以阅读以下文章来详细了解什么是语义化版本

版本约束

依赖信息的结构是一个对象,其中依赖包的名称作为键(key),依赖的版本约束作为值(value)。

{
  "dependencies": {
    "lodash": "^4.17.21",
  },
  "devDependencies": {
    "vite": "~4.2.0"
  }
}

版本约束限制了包管理器为项目安装依赖时可选的版本范围:

  • ^ 的含义是安装最新的 minor 版本。例如 ^1.2.0 的约束下,会为项目安装最新的 minor 版本 1.X.Y,但不会安装下一个 major 版本 2.0.0
  • ~ 的含义是安装最新的 patch 版本。例如 ~1.2.0 的约束下,会为项目安装最新的 patch 版本 1.2.X,但不会安装下一个 minor 版本 1.3.0
  • 如果版本号前面没有任何标识符,表示固定版本号,无论如何都只安装这个固定版本。

 

依赖分类

很多情况下,我们其实并没有真正搞懂常见的三种依赖类型—— dependenciesdevDependenciespeerDependencies 的真正含义与表现。这里简单给出一个表格说明帮助大家正确理解。

 

依赖类型 项目中 依赖中 用途
dependencies 会被安装 会被安装 项目运行时依赖
devDependencies 会被安装 不会被安装 项目在开发过程需要的依赖。一般构建工具、测试框架、代码规范工具都会被作为开发依赖
peerDependencies 不会被安装 不会被安装。但是若其中声明的依赖没有被项目安装,或者版本不匹配时,会生成警告信息提示用户 定义项目需要的依赖环境。常用于表示插件和主框架的关系,如 @vitejs/plugin-vue 的 peerDependencies 中就声明了主框架 vite 和 vue

 

中枢管理操作

在 workspace 模式下,代码仓根目录通常不会作为一个子模块或者 npm 包,而是**主要作为一个管理中枢,执行一些全局操作,安装一些共有的依赖。**下面介绍一些常用的中枢管理操作。

  • 创建一个 package.json 文件。
pnpm init
  • 设置用户的全局 .npmrc 配置
pnpm config set <key> <value>
  • 根据当前目录 package.json 中的依赖声明安装全部依赖,在 workspace 模式下会一并处理所有子模块的依赖安装
pnpm install
  • 安装项目公共开发依赖,声明在根目录的 package.json - devDependencies 中。-w 选项代表在 monorepo 模式下的根目录进行操作。
  • 每个子包都能访问根目录的依赖,适合把 TypeScriptViteeslint 等公共开发依赖装在这里。
pnpm install -wD xxx
  • 卸载公共依赖,在根目录的 package.json - devDependencies 中删去对应声明
pnpm uninstall -w xxx
  • 执行根目录的 package.json 中的脚本
pnpm run xxx

相关推荐

  1. 学习Vue

    2024-01-20 06:38:01       35 阅读
  2. Vue学习:22.Vue-Vant

    2024-01-20 06:38:01       15 阅读
  3. 开发Vue

    2024-01-20 06:38:01       16 阅读
  4. Vue UI

    2024-01-20 06:38:01       12 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-01-20 06:38:01       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-01-20 06:38:01       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-01-20 06:38:01       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-01-20 06:38:01       20 阅读

热门阅读

  1. GitHub 上如何提出 issue?

    2024-01-20 06:38:01       29 阅读
  2. 爬虫系列实战:使用json解析天气数据

    2024-01-20 06:38:01       30 阅读
  3. Note of CLEAN CODE chapter 2 - Meaningful Name

    2024-01-20 06:38:01       25 阅读
  4. uniapp echarts x轴 支持html标签

    2024-01-20 06:38:01       29 阅读
  5. Webpack5入门到原理10:处理其他资源

    2024-01-20 06:38:01       33 阅读
  6. 【mfc/VS2022】绘图工具设计-绘制基本图元2

    2024-01-20 06:38:01       35 阅读