22

我有一个 Angular (4.3.2) 应用程序,我想在其上执行 AOT 构建。应用程序是使用@angular/cli. 我有两个组件ng generate和一个模块,其中两个组件都包含在声明中:

import {PrivateComponent} from './private.component/private.component';

NgModule({
   imports: [
      // other imports
      PrivateRoutingModule
   ],
   declarations: [
      ...some other components, 
      PrivateComponent, 
      AppTopBarComponent
   ]
   // other stuff 
}) 
export class PrivateModule {}

私有组件也用于模块的路由:

const routes: Routes = [
  {path: '', component: PrivateComponent, children: // other components}
] 

@NgModule({
   imports: [RouterModule.forChild(routes)] // this is the Angular built-in router module
})
export class PrivateRoutingModule {}

注意路由是如何在另一个模块中定义并导入到模板中使用的PrivateModule 。所以两者都被使用和声明。但是当我使用(我在 Windows 10 上)时,我收到以下错误消息: . 我的文件与Angular AOT 构建指南中的完全相同。AppTopBarComponentPrivateComponent's"node_modules/.bin/ngc" -p tsconfig-aot.jsonCannot determine the module for class PrivateComponent in (path-to-project)/src/app/pages/private/private.component/private.component.ts! Add PrivateComponent to the NgModule to fix it. Cannot determine the module for class AppTopBarComponent in (path-to-project)/src/app/pages/private/app.topbar.component.ts! Add AppTopBarComponent to the NgModule to fix it.tsconfig-aot.json

4

4 回答 4

34

确保您不会意外有两个文件声明相同的组件

如果我运行时在错误的目录中,经常会发生这种情况ng g c,并且不要立即删除错误的生成文件。

错误:无法确定 S:/.../src/app/common-widgets/feature-widgets/feature-box-group/feature-box-group.component.ts 中的 FeatureBoxGroupComponent 类的模块!将 FeatureBoxGroupComponent 添加到 NgModule 以修复它。

在这个例子中,我FeatureBoxGroupComponent在两个地方定义了:

src\app\common-widgets\feature-widgets\feature-box-group\feature-box-group.component.ts

src\app\feature-widgets\feature-box-group\feature-box-group.component.ts

当然,错误消息告诉我它有问题的确切文件 - 但很容易看一眼。

只需在文件中查找组件名称即可查看引用它的所有位置,并确保它只定义一次。

于 2018-07-12T20:00:05.017 回答
19

我实际上已经找到了解决方案。问题是PrivateComponent在另一个文件中导入了,但没有使用,就像这样:

import { PrivateComponent } from '../private/private.component'; // not used anywhere

显然ngc试图链接所有内容并被未使用的导入混淆

于 2017-09-04T08:09:33.423 回答
2

假设您使用的是VScode.

  1. 关闭所有打开的选项卡。
  2. 停止ng serve
  3. 通过 将指示的组件文件夹移动到其他位置VScode
  4. 如果选项卡在移动后打开,请关闭它们并在关闭时保存更改(由于路径更改)。
  5. ng build它现在应该在您运行时编译--aot

如果您愿意,您可以执行相同的过程将文件夹移回原始位置。

此外,在我解决问题后检查git diff并意识到问题出在外壳上。我将文件夹名称更改为大写,但路径中没有更新。

于 2019-07-01T17:50:36.193 回答
1

我遇到了这个问题,当我使用ng build而不是ng build --prod.

显然我有两个模块我没有使用但没有从应用程序文件夹中删除。它们也没有在 app.module.ts 文件夹中声明。

根据文档,该--prod标志也会导致编译器执行一些死代码消除。

于 2019-03-14T13:32:00.693 回答