Angular Schematics,修改angular.json的代码并没有结合在一起

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Angular Schematics,修改angular.json的代码并没有结合在一起相关的知识,希望对你有一定的参考价值。

我一直在使用原理图来生成标准化项目。我有几个问题,所有问题都与修改angular.json文件有关

下面的代码是我尝试过的示例,在一个可以工作的函数中执行(除了另一件事),并且其中的所有内容都会被执行,除了这部分,它会抛出一个错误:

无法读取未定义的属性'includePaths'

这对我没有任何意义。

你在这里看到的另一个问题是我似乎无法捕获项目的名称,因为我需要修改angular.json文件中“架构师”内的内容,我必须通过项目的名称,我有的解决方法是手动输入项目的名称为

ng add myschemat --name=new-app

但我应该能够捕获这个属性,我已经尝试过并且确实可以在控制台中看到它但是当替换options.name为p时(来自注释的forEach函数)它不起作用并显示无法获取'undefined的建筑师财产

import {NodePackageInstallTask} from '@angular-devkit/schematics/tasks';

[...]


    if(_host.exists('angular.json')){
      const angularStr = _host.read('angular.json') !.toString('utf-8')
      const angular = JSON.parse(angularStr)
      const projs = (Object.keys( angular['projects'] )).slice(0, 1); //also tried [0]

      console.log("App Detection & your options: 
", projs, "
", options)
      // projs.forEach((p: string | number) => {
        angular['projects'][options.name]['architect']['build']['options']['stylePreprocessorOptions'] = 
        { 
          "includePaths": ["src/scss/"] 
        }
        angular['projects'][options.name]['architect']['build']['options']['es5BrowserSupport']= true;
        angular['projects'][options.name]['architect']['build']['options']['styles'].push(
          [
            "node_modules/devextreme/dist/css/dx.common.css",
            "node_modules/devextreme/dist/css/dx.light.css",
            "src/styles.scss"
          ]
        )
      // });

      _host.overwrite('angular.json', JSON.stringify(angular, null, '	'))

      _context.addTask( new NodePackageInstallTask )
    }

应该发生的是添加对象属性

"styles": [
  "node_modules/devextreme/dist/css/dx.common.css",
  "node_modules/devextreme/dist/css/dx.light.css",
  "src/styles.scss"
],
"scripts": [],
"es5BrowserSupport": true,
"stylePreprocessorOptions": {
  "includePaths": [
    "src/scss/"
  ]
}

然而,当我编译ng add myschemat --name=new-app

安装停止并简单地显示:无法读取undefined的属性'includePaths'

这很奇怪,因为它实际上曾经工作过,我只是添加了几个样式和真正的属性以及对package.json的一些更改(即使这些发生在此angular.json修改之前,它们似乎没有改变任何东西

有什么我肯定在这里失踪的吗?

答案

这不是一个解决方案,但我只是创建了另一个项目,复制了所有内容并且工作了。

以上是关于Angular Schematics,修改angular.json的代码并没有结合在一起的主要内容,如果未能解决你的问题,请参考以下文章

在集合“@schematics/angular”中找不到原理图“库”

找不到模块'@angular-devkit/schematics/tasks'

Angular Schematics 相对路径

Angular 6 Schematics 无效源(未定义)

如何运行@angular-eslint/schematics:convert-tslint-to-eslint

ClassOptions Schema - Angular Schematics