Angular 应用程序中 framework.json 文件的提案

Question

Angular 应用程序中 framework.json 文件的提案

有时很难弄清楚角分量之间的所有关系，尤其是当它们变得很多时。 您想一眼就知道谁是谁的孩子，谁的父母，或者组件在哪里使用。 也许您想知道正在共享哪个服务或指令。 我在网上找不到任何帮助解决这个问题的东西。 所以我想出了一个实际显示应用程序框架的框架文件。 这将是一个 JSON 文件，具有以下特征：

• 组件：驼峰式字符串 -> 组件的类名 -> 它是一个对象，其属性为：
  • @string（见下文），顺序如下：服务（@Ser），指令（@Dir），模型（@Model）， 模块 (@Mod), @router-outlet;
  • 其他组件；
  • 如果没有孩子或@string，对象将为空。
• @string 属性键值->
  • @Ser 是服务的数组，元素是服务的类名（驼峰式）；
  • @Dir 是一个指令数组，元素是指令的类名（驼峰式）；
  • @Model 是一个模型数组，元素是模型的类名（驼峰式）；
  • @Mod 是一个模块数组，元素是模块的选择器名称（精确匹配）；
  • @router-outlet，是一个对象，属性是组件
• 相同的缩进 -> siblings
• 不同的缩进 -> lower is child of higher parent (or is displayed in router-outlet)

这是示例应用程序的实例：

{
    "AppComponent": {
        "HeaderComponent": {},
        "@router-outlet": {
            "RecipeComponent": {
                "@Ser": ["RecipeService"],
                "RecipeListComponent": {
                    "@Ser": ["RecipeService"],
                    "@Model": ["Recipe"],
                    "RecipeItemComponent": {
                        "@Model": ["Recipe"]
                    }
                },
                "@router-outlet": {
                    "RecipeStartComponent": {},
                    "RecipeEditComponent": {
                        "@Ser": ["RecipeService"]
                    },
                    "RecipeDetailComponent": {
                        "@Ser": ["RecipeService"],
                        "@Dir": ["DropdownDirective"],
                        "@Model": ["Recipe"]
                    }
                }
            },
            "ShoppingListComponent": {
                "@Ser": ["ShoppingListService"],
                "@Model": ["Ingredient"],
                "ShoppingEditComponent": {
                    "@Ser": ["ShoppingListService"],
                    "@Model": ["Ingredient"]
                }
            }
        }
    }
}

为应用程序提供这样的文件可能是最佳做法，我会将其嵌套在应用程序文件夹中。 欢迎提出建议和意见。

GitHub：https://github.com/Arboricum/Improvements-for-Angular