Angular库引入第三方npm包（Ionic、Crypto等）的使用疑问

首先得给你点个赞，peerDependencies的配置方向完全正确！这个字段的核心作用就是告诉使用你这个库的项目：“嘿，我需要这些依赖才能正常工作，但我不会把它们打包进来，你得自己安装对应版本哦”。接下来咱们一步步解决问题，让你能顺畅用上这些第三方包：

1. 先给本地开发环境装齐依赖（解决红色下划线） #

你现在代码里的红色下划线，大概率是因为本地没安装这些包，IDE找不到模块定义。咱们把这些依赖装成开发依赖（因为只是本地开发调试用，打包库的时候不需要带它们）：

npm install --save-dev @angular/common@^8.2.14 @angular/core@^8.2.14 crypto-js@^3.1.9-1 sha256@0.2.0 @ionic-native/unique-device-id@^5.15.1 @ionic/angular@^4.1.0 @ionic/storage@^2.2.0

跑完这个命令，重启下你的IDE（比如VS Code），红色下划线应该就消失了。

2. 在库代码里正常导入使用就行 #

现在你可以像在普通Angular项目里一样，直接导入这些包使用，举几个实用例子：

用crypto-js加密数据 #

import * as CryptoJS from 'crypto-js';

// 比如在你的服务里封装加密方法
encryptUserInfo(info: string, secretKey: string): string {
  return CryptoJS.AES.encrypt(info, secretKey).toString();
}

用Ionic Native获取设备唯一ID #

import { UniqueDeviceId } from '@ionic-native/unique-device-id/ngx';

// 在服务/组件的构造函数里注入依赖
constructor(private uniqueDeviceId: UniqueDeviceId) { }

// 定义获取设备ID的异步方法
async getDeviceUniqueId(): Promise<string | null> {
  try {
    const uuid = await this.uniqueDeviceId.get();
    return uuid;
  } catch (error) {
    console.error('获取设备ID失败:', error);
    return null;
  }
}

3. 检查tsconfig配置（可选，解决少数类型提示问题） #

如果还有个别包的类型提示异常，可以打开库根目录的tsconfig.lib.json，在compilerOptions里按需添加需要的类型：

"compilerOptions": {
  // ...其他已有配置
  "types": ["node"] // 比如用到Node.js相关类型时添加，按需选择
}

4. 给用你库的开发者提个醒（npm会自动帮忙） #

当其他开发者安装你的sdk-mobil-login-light库时，npm会自动检测到peerDependencies的要求，在终端弹出提示，告诉他们需要安装哪些依赖包。他们只需要照着提示运行安装命令即可——如果他们的项目里已经有符合版本要求的依赖，甚至都不用额外安装。

5. 打包库的注意事项 #

当你运行ng build sdk-mobil-login-light打包库的时候，Angular CLI会自动忽略peerDependencies里的包，不会把它们打包到你的库产物中，只会保留代码里的导入语句。这样能避免重复打包依赖，也能有效防止版本冲突问题。

小Tips： #

• 要是红色下划线还顽固存在，试试删除node_modules和package-lock.json，重新跑npm install，再重启IDE。
• peerDependencies的版本范围尽量宽松点（比如用^），这样能兼容更多使用你库的项目版本。

内容的提问来源于stack exchange，提问作者Marc Rasmussen