问题标签 [angular-compiler]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
41 浏览

angular - 元数据版本不匹配 @netbasal/content-loader

模块 /Users/hardik.shah/git/admin/node_modules/@netbasal/content-loader/content-loader.d.ts 的元数据版本不匹配错误,找到版本 4,预期为 3,解析 /Users/hardik 中的符号 SharedModule .shah/git/admin/src/app/shared/shared.module.ts,解析符号SharedModule在/Users/hardik.shah/git/admin/src/app/shared/shared.module.ts

我正在使用的版本:

目前我有@angular/compiler@4.3.0,我试图降级@netbasal/content-loader@1.0.0,但我仍然面临同样的问题。

0 投票
1 回答
1557 浏览

angular - Angular 组件输入静态类型

我有 2 个角度分量。

ButtonComponent输入类型为ButtonText

MainComponent它使用按钮并将输入传递给它:

问题 - 如果我将错误类型的参数传递给输入。ng build不返回任何错误或警告。我已经尝试了[在角度文档中]描述的很多可能的角度编译器标志:(https://github.com/angular/angular/blob/master/aio/content/guide/aot-compiler.md#compiler-options

问题:如何在编译过程中实现静态类型检查?或者也许有任何静态分析工具可以实现这一点,例如模板 linter?

0 投票
0 回答
163 浏览

angular - Angular:解析自定义打字稿装饰器

我想使用 Typescript 装饰器来定义我的后端服务/模型参数到我的 Angular 项目中的前端类参数的映射。我无法更改后端,也不想为我的前端代码使用名称。

我的打字稿模型定义的示例:

从后端接收到的数据如下所示:

现在我想编写一个编译器钩子来分析所有这些@Param装饰器并生成一个带有映射的 JSON 文件:

稍后,我的服务将使用此映射文件来解析后端响应。

在后端“世界”(Java、PHP 等)中,这是注解的一种非常典型的用法,即像上面一样使用注解来定义数据库表/Web 服务和实体类之间的映射。

如何使用 Angular 实现这一目标?我的目标是在编译器调用时自动生成映射 JSON 文件。我可以定义某种编译器钩子吗?是否有示例甚至现成的解决方案(我可以想象还有其他有类似要求的人)?


0 投票
1 回答
268 浏览

angular - Angular 6、ngc、AOT、Angular 路由器、router.ngfactory 和 SystemJS

我有一个简单的 Angular 6 应用程序,我正在尝试使用 AOT 进行编译。 我没有使用 Angular CLI。我有一个自定义生成器,它为我的项目启动搭建脚手架,并为我的组件、服务等搭建脚手架。

在 AOT 之前,一切都按预期工作。当我运行 ngc 来编译我的 Angular 应用程序时,一切都编译没有错误。但是,当我检查编译的 ngfactory javascript 文件时,我会从 node_modules 目录中看到 @angular/router/router.ngfactory 的引用。我似乎无法在任何地方找到此文件。

我的配置如下:

  • 节点 v.10.10.0
  • 角度 v.6.1.2
  • 打字稿 v.3.1.1
  • SystemJS v 0.21.4
  • 吞咽 v.3.9.1

我创建了一个示例存储库来复制该问题。

该仓库位于SlyGenerator.DemoWithAOT

要使用 JIT 正常启动应用程序,请运行以下命令“npm run start-dev”

重现错误

  • 我运行“node_modules/.bin/ngc -p ./src/assets/ts/tsconfig.aot.json”这会在根级别生成一个带有 ngfactory 文件的“dist”文件夹。
  • 然后我将 dist 文件夹的内容复制到 ./app/assets/js/ (这允许我在不捆绑或缩小的情况下测试生成的代码。
  • 接下来我修改我的 system.config.js 文件以使用 Main.aot.js 文件而不是 Main.js 文件。System.config.js 文件位于 .app/assets/config/system.config.js

此时我收到以下错误:

语法错误:意外的令牌 <

我可以将 system.config.js 文件切换回原始文件,并且一切正常。

0 投票
1 回答
287 浏览

angular - Angular 编译器和入口组件

当我们使用'ngc'编译源代码并将skipTemplateCodegen设置为false时,ngc生成.ngfactory.js并且当有角度模块导入时,导入的模块具有入口组件,结果组件工厂也为这些入口组件生成并导入语句是使用相对路径生成的。

我们所拥有的是,ngc 编译 Angular 代码(生成工厂)并使用 rollupjs 将它们捆绑到 UMD 中;由于上面提到的入口组件的附加组件工厂,捆绑的 UMD 有点被污染,因为 import 语句具有到导入的 Angular 模块的入口组件的生成组件工厂的相对路径。

任何线索如何避免/解决这个问题?

使用https://github.com/iamrakesh/ng-extensions repo 进行复制。生成的 UMD JavaScript 可以查看 'platform/assets/sample-ext.module.umd.js'

更新:实际项目设置基于https://github.com/maximusk/extension-mechanism-demohttps://github.com/lmeijdam/angular-umd-dynamic-example

更新:将 github 存储库更新为具有完整概念实现的不同存储库。

0 投票
0 回答
597 浏览

angular - 无法在 AOT 模式下动态生成的 Angular 模块中的动态生成组件的模板中使用异步管道

免责声明:这个问题的灵感来自于 Medium 上的“ Here is what you need to know about dynamic components in Angular ”。

有一位作者展示了如何动态生成模块和组件,将后者放入前者,动态编译模块,获取组件工厂并使用它通过ViewContainerRef生成组件。

这在基本设置中工作得很好。

现在让我们假设我们想要动态生成一个组件,但这次使用的是使用异步管道的模板。

接下来,我们需要让这个东西在生产环境中工作,这意味着两件事:

由于 Angular 编译器不可用,我们可以为应用程序根模块中的 Compiler 令牌提供一个jit 编译器的实例。

app.module.ts:

app.component.ts

如果我们运行它并打开 DevTools,我们可以看到以下错误:

ERROR 错误:模块“function(){}”导入了意外的值“function(){}”。请添加 @NgModule 注释。

该问题仅在开发模式下发生。Angular 版本是 7.2.0。

因此问题是 - 必须做些什么才能使其在 AOT 模式下工作?

0 投票
0 回答
585 浏览

node.js - 在 Angular 7 中找不到“AppModule”的 NgModule 元数据

介绍

我正在尝试创建自己的自定义平台以在 Angular 7 中使用。基本思想是提供一个用于渲染到终端的平台。这是我目前所在的位置:

编码

平台控制台/控制台渲染器.ts

(或多或少基于 Victor Savkin 非常出色的教程:Angular Renderers 实验

平台控制台/console.ts

(松散地基于Angular 提供的平台

main.ts

(在我的测试应用程序中)

app.module.ts

(在我的测试应用程序中)

我正在使用 angular-build:server 构建器,因为它似乎是其中最直接的一个。在使用 CLI 启动一个全新的 Angular 应用程序后,其他所有内容几乎都是您所得到的。

错误

一切都很好地编译成一个 main.js 文件,但是当我运行它时,我得到一个错误:

我在这里想念什么?为什么我的元数据没有进入编译包?

我想知道是不是因为我正在使用 JitCompiler,也许服务器构建器将我的文件视为 Aot... 如果是这种情况,我如何创建和使用 AotCompiler 而无需从刮?

笔记

仅使用填充到 platformServer 中的渲染器,我就能够成功运行,但我无法从组件内部访问 Node(我想那里有一些浏览器沙箱在起作用)。这是一个交易破坏者,因为我打算实现与操作系统的节点级接近性与 Angular 等人提供的所有动态/反应性优点的梦想组合。最终,我想用一个合适的 EventManager 来扩展这个新生平台,该 EventManager 由 Node 的事件以及人们期望在终端内拥有的任何其他服务驱动。

我发现很难找到有关在这层 Angular 中工作的信息。

感谢您的时间。

0 投票
1 回答
340 浏览

angular - 带有事件发射器的 Angular 动态 Html 模板组件

我正在尝试通过添加通用事件发射器来扩展此组件的功能

归功于原作者 https://gist.github.com/benjamincharity/8116414c7f38cffe3cef0e44fe44295d

所需事件的示例

我尝试将其添加到 htmlOutlet 类以及 DynamicComponent 我收到错误消息

这告诉我该函数在 componentFactory 中创建时没有正确添加到类中

任何 Angular 大师,能够对我如何让它发挥作用有所了解?

0 投票
2 回答
57 浏览

angular - 分离 NgModules 会减少构建时间吗

假设我们有一个很大NgModule的 the SharedModule,它导出了多个组件中需要的很多组件。通过将其SharedModule导入功能模块通常会产生开销,因为所有共享组件都会被导入,而不仅仅是那些必要的。拆分会SharedModule减少构建/编译时间吗?除了可读性更好的代码之外,将其拆分成更小的模块还有什么好处吗?

非常感谢你的帮助!

0 投票
2 回答
133 浏览

angular - 我在为 android 创建 prod APK 时遇到问题

我已经通过“ionic serve”成功运行了离子应用程序,之后我正在创建我面临问题的 prod APK。

我正在使用的命令是“Ionic cordova platform add android@6.3.0”平台添加成功之后我正在执行“Ionic cordova build android --prod”这个命令抛出错误。

1)Ionic cordova 平台添加android@6.3.0 2)Ionic cordova build android --prod