安装 ​

环境要求 ​

  • Node.js >= 22.21.1
  • pnpm >= 10.25.0
  • Vue >= 3.5

Vue2 存量项目使用兼容包，移动端对应 @szhn/dh-design-mobile-vue2，PC 端对应 @szhn/dh-design-pc-vue2。

配置私有镜像源 ​

DHdesign 组件包发布在数字海南内部 npm 镜像，安装前需在项目根目录的 .npmrc 中配置：

ini
@szhn:registry=https://npmmirror.digitalhainan.com.cn

安装移动端组件库 ​

shell
pnpm add @szhn/dh-design-mobile
shell
npm install @szhn/dh-design-mobile
shell
yarn add @szhn/dh-design-mobile
shell
bun add @szhn/dh-design-mobile

安装 PC 端组件库 ​

PC 端基于 Element Plus，element-plus 是对等依赖（peerDependency），需要和组件库一起安装，版本 ^2.14.3。项目中已有 Element Plus 时会直接复用，不会重复打包两份。

shell
pnpm add @szhn/dh-design-pc element-plus
shell
npm install @szhn/dh-design-pc element-plus
shell
yarn add @szhn/dh-design-pc element-plus
shell
bun add @szhn/dh-design-pc element-plus

同时安装 ​

如果项目同时使用移动端与 PC 端组件库，可以一次安装：

shell
pnpm add @szhn/dh-design-mobile @szhn/dh-design-pc
shell
npm install @szhn/dh-design-mobile @szhn/dh-design-pc
shell
yarn add @szhn/dh-design-mobile @szhn/dh-design-pc
shell
bun add @szhn/dh-design-mobile @szhn/dh-design-pc

Vue2 老项目 ​

移动端老项目：

shell
pnpm add @szhn/dh-design-mobile-vue2
shell
npm install @szhn/dh-design-mobile-vue2
shell
yarn add @szhn/dh-design-mobile-vue2
shell
bun add @szhn/dh-design-mobile-vue2

PC 端老项目：

shell
pnpm add @szhn/dh-design-pc-vue2
shell
npm install @szhn/dh-design-pc-vue2
shell
yarn add @szhn/dh-design-pc-vue2
shell
bun add @szhn/dh-design-pc-vue2

Vue2 兼容包只用于存量项目。新项目继续使用 @szhn/dh-design-mobile 和 @szhn/dh-design-pc。