angularjs - Angular Schematics - 在树上应用数以千计的更改导致错误超出最大调用堆栈大小

Question

我尝试将一个大型 AngularJs 项目迁移到 Angular。我发现 Angular Schematics 是自动执行某些任务的好方法。

我的第一个任务是为每个文件夹创建组件，我有大约 1200 个组件要创建。

我的函数是这样的:

return (tree: Tree, _context: SchematicContext) => {
    const directory = tree.getDir('my_path/pages');

    const rules: Rule[] = [];
    directory.visit((filePath) => {
        if (!filePath.endsWith('config.ts')) {
            return;
        }

        const parsedPath = parseName(dirPath, basename(filePath).split('.')[0]);
        options = {
            path: parsedPath.path,
            name: parsedPath.name
        };

        const templateSource = apply(
            url('./files'),
            [
                applyTemplates({
                    ...strings,
                    ...options
                }),
                move(parsedPath.path)
            ]
        );

        const rule = mergeWith(templateSource);
        rules.push(rule);
    });

    return chain(rules);
};

所以我最终将 1200 条规则链接到我的树，这导致了错误 Maximum call stack size exceeded。 如何有效地应用基于模型的组件创建？

*该代码适用于较小的项目，例如创建 200 个组件。

我在 Github repo of Angular-Cli 上创建了一个问题

Answer 1

由于 API 接受 Promise，您可以使用异步规则解决此错误:

return chain(rules.map(rule => () => Promise.resolve(rule)));