在Angular 4中，当将模板和样式定义到外部文件中时，不再需要在模块类中加入类似下面的moduleId。

@Component({
    moduleId: module.id,

})

我会补充一些细节内容并加入需要注意的事项。

在Angular 4的「TUTORIAL」中，没有使用moduleId。

当阅读Angular 4中的“TUTORIAL”中的“Routing”章节时，确实可以看到没有使用moduleId（请参考“将英雄添加到仪表板”的部分）。

@Component({
    selector: 'my-dashboard',
    templateUrl: './dashboard.component.html',
})

作为一个例子，”Angular Example – Tour of Heroes: Part 5″ 的代码也可以在没有moduleId的情况下正常运行。

能够省略moduleId的功能是SystemJS插件。

根据Angular公式网站的“更新日志”，在“所有moduleId的提及已删除。删除了“组件相对路径”食谱（2017-03-13）”一节中简要解释了这个问题。moduleId的不再需要是由于SystemJS插件（systemjs-angular-loader.js）的修改。因此，这并不是针对Angular 4的规范变化，而且插件必须包含在环境中（有关环境设置，请参阅“设置本地开发环境”）。

如果你在组件中使用这个插件，并且通过相对路径指定了模板(templateUrl)和样式(styleUrls)的外部文件，它会将它们转换为绝对路径。据Angular官方网站称，所有的信息都应该基于这个设置。强烈推荐使用模块中的相对路径，而不是使用moduleId。

我们强烈建议您仅使用组件相关路径。这是本文档中讨论的唯一URL形式。您不再需要编写@Component（{ moduleId：module.id }），也不应该这样做。

相对路径必须以’./’开头。

我曾经按照Angular 2的“TUTORIAL”撰写了一篇入门指南“Angular 2入门”，现在我尝试将该代码移植到Angular 4上。然而，如果省略moduleId，代码将无法正常运行（严格来说，如果注释//存在，会导致tsc错误，因此我删除了每行代码）。

@Component({
    // moduleId: module.id,  // 動かない
    selector: 'my-dashboard',
    templateUrl: 'dashboard.component.html'
})

如果你仔细对比一下Angular 4「教程」之前的代码，你会发现只有一个地方有所不同。为了省略moduleId，相对路径必须以’./’开头。

在Angular 2的官方网站上的“TUTORIAL”中，至少在解释中，我记得路径开头没有’./’，直接以文件名记录。虽然这是一个简单的事情，但我花了一些时间才注意到。根据前面的“Change Log”，据说从网站的解释中完全删除了对moduleId的提及。对于Angular 2的用户来说，希望至少保留一些注释。