Question

在我的应用中，我有一个名为“ plugins”的文件夹，我们在其中放置了这样的内容：

plugins
+---plugin_name
|   +---plugin stuff (components, routes, providers, guards, etc)
|   \---index.ts
+---plugin2_name
|   +---plugin2 stuff (components, routes, providers, guards, etc)
|   \---index.ts 
|
[...]
|
\---index.ts

每个插件的index.ts就像：

import { Routes } from '@angular/router';
import { TestComponent } from './test/test.component';
import { Test2Component } from './test2/test2.component';

export const COMPONENTS = [TestComponent, Test2Component];

export const PLUGIN_ROUTES: Routes = [
    {
        path: 'test', component: TestComponent, children: [
            { path: 'test2', component: Test2Component }
        ]
    }
];

上层文件夹的index.ts收集来自所有插件的所有信息，如下所示：

import * as TestPlugin from './plugin_name';

export const Plugins = {
    Components: [] = [
        ...TestPlugin.COMPONENTS
    ],
    Providers: [],
    Routes: [
        ...TestPlugin.PLUGIN_ROUTES
    ],
    Guards: []
};

因此，在app.module.ts中，我可以导入Modules常量，并在需要的地方“展开”

例如

@NgModule({
  declarations: [        
    [...Modules.Components]
  ],

通常的想法是，如果我们需要添加一个新的插件，我们只需要将文件拖放到该文件夹中并仅编辑上面的索引即可。

有没有更聪明的方法来实现这一目标？所有插件index.ts具有相同的结构，是否有可能创建类似服务的东西来“自动”将来自所有index.ts的所有引用收集到Modules const中？

我们在webpack中使用angular-cli，我们不需要即时加载内容，只要添加了插件，我们就可以重新编译所有应用程序。

是否可以在编译时以成角度的方式在导入中添加组件？

0 个答案: