打包 Angular 库以支持 Angular 8、9 和 10 的正确方法

2024-03-26

随着 Angular 10 的发布,我将用于构建库 + 演示应用程序的 Angular 版本更新到版本 10。

一般来说,这一切进展顺利,并且该库仍然与 Angular 的早期版本兼容,但此版本的情况似乎并非如此(针对 Angular 9 的先前版本构建与 Angular 8 运行良好)。

输出打字稿定义文件包括:

import * as ɵngcc0 from '@angular/core';

...

static ɵfac: ɵngcc0.ɵɵFactoryDef<QrCodeComponent, never>;
static ɵcmp: ɵngcc0.ɵɵComponentDefWithMeta<QrCodeComponent, "qr-code", never, { "value": "value"; "size": "size"; "errorCorrectionLevel": "errorCorrectionLevel"; }, {}, never, never>;

在 Angular 8 项目中使用时会导致这样的错误:

 ERROR in node_modules/ng-qrcode/lib/qr-code.component.d.ts(7,25): error TS2694: Namespace '"/ngqrcode-ng8-test/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDef'.
    node_modules/ng-qrcode/lib/qr-code.component.d.ts(8,18): error TS2314: Generic type 'ɵɵComponentDefWithMeta' requires 6 type argument(s).
    node_modules/ng-qrcode/lib/qr-code.directive.d.ts(13,25): error TS2694: Namespace '"/ngqrcode-ng8-test/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDef'.

我使用以下命令新创建了测试 Angular 8 项目:

npx @angular/cli@^8 new ngqrcode-ng8-test

您可以在此处查看我对此更改的 WIP 拉取请求:https://github.com/mnahkies/ng-qrcode/pull/8 https://github.com/mnahkies/ng-qrcode/pull/8

注意:我的编译器选项中已经设置了enableIvy false:

"angularCompilerOptions": {
    "enableIvy": false
  }

有没有办法使用 Angular v10 构建一个保持与 Angular v8 兼容性的库?


Angular 10 有 2 个重大变化:

  1. 10 需要 tslib 2.0.0 vs.
  2. 10 使用 typescript 3.9 vs.

我不认为你可以将 8、9 和 10 的库打包在一个包中:-)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

打包 Angular 库以支持 Angular 8、9 和 10 的正确方法 的相关文章

  • Ionic 2 自定义后退按钮操作

    我想自定义此屏幕截图中提到的后退按钮的单击操作 我希望通过单击我不会返回到上一页 而是返回到我自己指定的页面 或者在返回之前进行处理 要自定义默认后退按钮操作 您需要覆盖返回按钮点击 NavBar 组件的方法 Step 1 在你的 自定义类
  • 角度 2 中的事件发生后重置计时器

    我在 15 分钟空闲会话后实现注销 而不使用第 3 方库或 ngrx 我创建了一个服务 run window onload gt this startTimer window onmousemove gt this resetTimer s
  • 如何使用 Typescript 从 mui 扩展调色板

    我正在尝试扩展 mui 提供的调色板 覆盖主色 次要颜色等效果很好 但如果我想在之后创建一组自定义颜色 我不知道如何使其工作 有很多没有打字稿的例子 但是当这个人进入游戏时 事情就变得更加棘手 假设我有这个 主题 tsx palette p
  • 将隐式键和值类型关系传递给 TypeScript 泛型

    Target 注意替换isInvalid false and validationPending false按辅助类 函数 const controlsAccess senderName ControlAccess
  • “导航器”类型上不存在属性“存储”

    我正在尝试使用以下命令行从 Angular2 组件获取配额存储信息 navigator storage estimate then data gt console log data 该命令在纯 Javascript 脚本中可以正常工作 但无
  • 如何绕过警告意外的任何。指定不同的类型 @typescript-eslint/no-explicit-any

    我们有严格的零棉绒问题政策 这意味着所有错误和警告都需要修复 在我们的 React typescript 项目中面临这个 lint 错误 warning Unexpected any Specify a different type typ
  • 角度传输状态不会阻止重复的 http 调用

    我将 http 请求作为一项服务注入到我的组件中并从那里订阅 由于我在应用程序中引入了具有通用角度的服务器端渲染 因此页面上的结果至少重复两次 我有一个在单击时调用的方法 该方法对 facebook 的 api 执行 http 请求 get
  • ng2-select 中的数据绑定失败

    我正在尝试使用 ng2 select 将对象数组绑定到下拉列表 当我尝试使用字符串数组时它工作正常 private category Array value 1 text Table value 2 text Chair value 3 t
  • 如何取消/关闭 Angular 中的行为主体

    我有一个订阅了行为主题的组件ngOnInit生命周期 该组件 html 使用ngIf在渲染表格之前查看数据是否存在 当我离开该页面时 我想确保下次返回时 该表不可见 直到再次获取该数据 到目前为止 我能够做到这一点的唯一方法是调用该主题的
  • Angular:使用 @ContentChildren 让子组件进入另一个组件

    我在 Angular 6 中创建了一个自定义轮播组件 简单用法如下
  • 使用 angular-cli 运行 Protractor 时 SpecReporter 不是构造函数错误

    当我尝试跑步时ng e2e或直接protractor命令我收到此错误 14 39 00 I update chromedriver chromedriver 2 28 up to date 14 39 04 I launcher Runni
  • Ionic 2 获取离子输入值

    我正在使用 ionic 2 创建登录名 请不要只回答 您只需要添加 ngModules 属性 如果您认为这就是解决方案 请解释原因 解释一下 就像对孩子做的那样 我的代码在login ts import Component from ang
  • 如何在 Angular 2 中订阅 DOMContentLoaded 事件?

    我正在将 UI 主题从 Angular 1 移植到 Angular 2 在第 1 个版本中 我有 viewContentLoaded事件 我想将其重新制作为 Angular 2 我正在尝试使用 HostListener DOMContent
  • Angular2更改检测“表达式在检查后已更改”

    我在 Angular2 最终版本 中遇到了有关组件之间的更改检测和数据流的问题 我已经解决了这个问题 但对我来说似乎有点老套 所以想知道是否有更好的方法 基本上我有一个组件 A 它有一个子组件 B 还有 ngFor 创建多个子组件 C 对于
  • node_modules 显示为空,您可能需要运行 `npm install`

    我从 git 克隆了一个 Angular 4 项目 当我转到项目的根文件夹并执行时ng serve 我收到以下错误 node modules appears empty you may need to run npm install 我该如
  • Angular2 RxJS从地图函数调用类函数

    我是 Angular 2 和 Observables 的新手 所以如果我的问题微不足道 我深表歉意 无论如何 我正在尝试使用 RxJS 测试 Angular 2 HTTP 客户端 虽然我让它工作了 但我需要向我当前正在处理的服务添加更多逻辑
  • Angular 2 - 形成组组件

    我正在尝试构建一个数据驱动的表单 输入来自另一个组件 如下所示
  • Angular2 - 根相对导入

    我在 angular2 typescript 中导入时遇到问题 我想使用一些像 app components calendar 这样的根目录的导入 而我能够使用的唯一方法是 app views order order view ts imp
  • 指令中的 Angular2 样式

    在属性指令 即添加外观 行为的指令 的给定示例中 我们在宿主元素上对样式进行了相当简单的设置 import Directive ElementRef from angular2 core Directive selector myHighl
  • 如何在 Angular Material 2 中使用 mat-chip 和自动完成功能保存选定的对象

    我正在使用 Angular 6 和 Angular Material 我正在尝试从 mat chip 和自动完成功能中保存选定的对象或选定对象的列表 我能够将字符串值发送到fruits 数组 但无法将选定的对象发送到fruits 数组 请帮

随机推荐