Angular 懒加载同名模块组件

Question

我有一个带有多个延迟加载模块的 Agular 应用程序。这些模块各自包含一些不同的组件，这些组件在逻辑上相似但内容不同。例如。每个模块都可能有自己的“主页”组件。

这些组件的名称完全一样可以吗？

对我来说，在每个模块名称前加上前缀似乎过于冗长。特别是当名字开始变长的时候，考虑到我想保持简洁和可读性之间的平衡。

在功能上这似乎不是问题。以下面的应用为例。它有 2 个惰性加载模块，每个模块包含 2 个与另一个模块中的组件同名的组件。一个组件由模块的路由加载，另一个组件通过第一个组件模板中的选择器加载。

我知道这个问题可能被认为是基于意见的，但是有什么技术原因不应该这样做吗？（我也很想知道意见，如果有人想私信我）

Answer 1

嘿，您可以在 tsconfig.json 路径中使用导入别名

"paths": {
    "@modules": "app/test-mod(?:\.\d+)?"
},

您可以使用正则表达式来匹配文件结尾名称，这样如果您有多个文件夹，您可以将它们命名为 file1、file2、file3 和 son 在导入时使用

匹配它们

import('@modules/innerfolder/mymodule.ts')

Answer 2

技术上没有问题，您可以使用相同的名称。就像我有许多模块将仪表板作为每个模块的组件。只要正确导入就可以了

但对于较大的应用程序，有时在自动导入时它可以导入指向与所需的不同的 1。这发生在我身上一次，我有 2 个不同的 add 和 list 组件，所以在自动导入时 url 指向错误的组件。

因此，为了清楚起见，如果您保留不同的名称（例如在其前面加上一些前缀），这样您就知道它是针对此模块的，那么我们就不能说它是或不是“好或坏的做法” .

Answer 3

我一直在开发一个项目，该项目有 5 个惰性加载模块，它们的子文件夹中有数百万个具有相同组件名称的组件。

我在开发过程中面临的充分理由或问题是在导入组件时自动导入有时会从不同的模块导入组件，这样我一直面临困惑并完成开发一段时间组件错误。

但是之后发生了 2 次，我在导入组件时非常安全

Angular lazy loaded module components with the same name