问题标签 [angular-aot]

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 投票
2 回答
1308 浏览

angular - 如何使用 ngc 启动监视模式?

我想做同样的事情,就像我在过去的美好tsc时光中所做的那样:只需调用 a tsc -w,并且在文件更改的情况下,它将即时重新编译。

不幸的是,ngc它甚至似乎对-w标志没有任何反应,甚至它可能的命令行参数也完全没有记录。

但是,ng build 一个--watch标志,同时它也可以创建 AOT 构建。因此,观察模式ngc可能是可能的。

但是怎么做?

0 投票
1 回答
59 浏览

angular - Angular2+ AOT 应用程序在导航到新路由(子路由)时在浏览器中打开新选项卡

我们现在有一个在 angular2+ 中运行的应用程序。我们最近开始使用 AOT,从那以后我们看到了一个奇怪的行为。如果我们单击带有路由(子路由)的任何链接,它将打开一个新选项卡一次,如果我们保留新打开的选项卡,则从下一次单击开始,路由更改将仅反映在该新选项卡上。如果我们关闭新打开的选项卡,下次单击任何路线链接时,它将再次打开一个新选项卡。简而言之,现在它基本上在 2 个选项卡上运行。可能是什么原因。?我希望我的问题很清楚。提前致谢。

这就是我们在链接中指定路由的方式。

0 投票
1 回答
272 浏览

angular - Angular AoT 编译

我正在浏览更新的 Angular 文档,发现他们现在已经改变了他们的方法。早些时候是这样的:

  1. 运行ng eject命令生成 webpack.config.js。
  2. 创建 webpack.config.aot.js、main-aot.ts、tsconfig-aot.json、index-aot.html,并为 aot 提供单独的代码。

现在,他们正在使用 rollup 和 system.js。

这背后有什么具体原因吗?对于服务器端渲染,它也提到了使用 webpack。为什么不同时使用 webpack?还提到 angular-cli 在后台使用 webpack,那么为什么需要使用 system.js?

0 投票
1 回答
55 浏览

css - 自 Angular Material2 beta7 以来,AOT 设置的风格被打破

自 Angular Material2 beta7 更新以来,由于这一重大变化,AOT 设置的样式信息似乎被破坏了。

字段边缘似乎消失了,下划线也消失了。一切似乎都排成一行。

在此处输入图像描述

尽管我已经按照步骤 4中的描述正确设置了角度材料预建主题。

0 投票
2 回答
439 浏览

angular - Angular AOT 编译的应用程序没有按预期摇树

我有一个MyCommonModule包含通用组件、服务等的模块 (),我计划在不同的 Angular 应用程序之间共享。

这是一个简单应用程序的示例,它只导入MyCommonModule(但还没有引用它AppComponent):

MyCommonModule定义如下:

当我运行时,ng build --environment=prod --target=production我得到一个 AOT:d 的构建。如果我使用分析输出,source-map-explorer我可以看到结果main.*.bundle.jsvendor.*.bundle.js包含 中的所有服务和组件(及其引用)MyCommonModule,即使我没有在我的应用程序中使用它。

这是预期的行为吗?是否为 Angular cli 应用程序启用了摇树?

0 投票
1 回答
2034 浏览

angular - Angular - useFactory - 不支持错误函数调用。考虑将函数或 lambda 替换为对导出函数的引用

我使用 Angular AOT 编译器版本 4.1.3

我有一个组件库,它导出一个工厂方法,然后用于提供服务:

我成功地编译了ngc

然后导入编译好的库,我LibServiceFactory在网站的AppModule中使用:

编译网站ng build出现以下错误:

错误(position 5:10 in the original .ts file)指向工厂方法中的匿名函数:return (http: Http): LibService => {

作为附加信息,我创建和使用工厂方法的方式与官方文档中关于注入令牌的 Angular 建议相同。

我的错误是预期的行为吗?还是我的实现有问题?

0 投票
2 回答
709 浏览

angular - 尝试在 Angular 4 中编译 AoT 时出错

当尝试运行“node_modules/.bin/ngc”-p tsconfig-aot.json (这是 NGC 命令来编译 AoT 应用程序)时,我收到以下错误,并且不明白为什么它们会被吐出。

AoT 的相关文件

tsconfig-aot.json

main.ts

我想从 JIT 迁移到 AOT 以获得更快的加载时间,这样当我实现 Tree Shaking 时它会更有效,但我不知道如何处理这些错误。请帮忙

0 投票
0 回答
72 浏览

angular-cli - 带有包含另一个 node_modules 文件夹的自定义库的 Angular/Cli AOT

我遇到了 AOT 编译和自定义包的问题。在我的场景中,我有一个 Angular/Cli 项目,它安装了我自己的包(包 A)。包 A 依赖于包含服务的包 B。

包 A 的 NPM 安装导致 node_modules 结构:

  • 节点模块
    • package_a
      • (package_a 文件)
      • 节点模块
        • 包_b
          • (package_b 文件)
          • 测试服务.ts

这似乎是有道理的,因为包 A 依赖于包 B 的某个版本,因此包 B 安装在嵌套的 node_modules 文件夹中。我还确保包 A 从包 B 中导出 TestService,以便它可用。

我遇到的问题是尝试从主项目访问包 B 中的服务时:

app.component.ts

首先,当我运行 ng serve 时,一切正常,完全没有问题。但是,当我尝试使用 AOT 编译构建项目时,它失败并出现错误:ERROR in ... Cannot find module.

如果我单独安装包 B,那么在主 node_modules 目录中有一个它的实例,那么整个事情就可以工作了。即使嵌套版本不同,它也会正确使用包 A 中定义的嵌套版本。

  • 节点模块
    • package_a
      • (package_a 文件)
      • 节点模块
        • package_b [版本 1.0.0]
          • (package_b 文件)
          • 测试服务.ts
    • package_b [版本 2.0.0]
      • (package_b 文件)
      • 测试服务.ts

有什么想法可以停止额外安装包 B 的需要吗?在主版本之前我是否缺少指向嵌套版本的内容?

0 投票
0 回答
36 浏览

angular - 动态主机名和aot

我想用这种语法在组件主机上绑定一个动态类名:

当我尝试在 AOT 模式下使用 angular-cli 构建时,出现以下错误:

错误中的错误遇到静态解析符号值。不支持表达式形式

我怎样才能让它工作?

谢谢

0 投票
0 回答
351 浏览

angular - 预期“样式”中的 Webpack + Angular4 AoT 错误是字符串数组

运行 Webpack3 和 Angular4 AoT 时出现错误(仅在 AoT 中发生)。我收到的错误是ERROR in Expected 'styles' to be an array of strings.. 我已经尝试了这里建议的其他几种方法https://github.com/webpack-contrib/style-loader/issues/123但没有运气。

下面是我的 webpack 配置:

我的 package.json 是:

除了上述方法,我还尝试了 Extract Text Webpack Plugin,但也没有运气。这是我尝试使用 ETWP 3.0.0-beta3 的配置

我很好奇是否有人看到我可能正在做的其他案件可能没有的任何事情。

另外,有谁知道如何调试可能导致此问题的文件?我从收到的错误中找不到任何有用的错误。