如何为使用Jest的NgRx项目配置Bazel?

时间:2019-06-27 17:11:30

标签: angular ngrx bazel jest

我有一个使用NgRx和Jest的现有Angular项目。我想将项目转换为对Angular CLI(https://next.angular.io/guide/bazel)使用新的可选的Bazel预览。不幸的是,通过运行ng add @angular/bazel生成的配置无法正确构建我的项目。

这是一个使用Angular Material,NgRx和Jest的Angular 8项目。它是使用nrwl / nx Angular CLI帮助器生成的,因此文件夹结构与标准Angular项目略有不同。我还根据以下说明选择了常春藤:https://angular.io/guide/ivy

我在这里仔细阅读了示例angular + bazel项目:https://github.com/angular/angular-bazel-example 但是,该项目与我的项目不同之处在于,它使用的是Karma + Jasmine,而不是Jest。 (我不知道这种差异是否与我的问题有关。)

运行yarn ng add @angular/bazel后,我还运行yarn add parse5来解决此处评论之一所描述的错误:https://github.com/lukasgeiter/gettext-extractor/issues/17

由于nrwl / nx文件夹结构的原因,自动bazel配置对我不起作用(它期望src文件夹位于工作空间的根目录,但我的文件夹位于apps / angularchatclient /下)。通过在我的angular.json文件的多个位置将"targetLabel": "//src:prodapp",更改为"targetLabel": "//apps/angularchatclient/src:prodapp",,我取得了一些进展。我还将--leaveBazelFilesOnDisk选项与ng build一起使用,以便可以将BUILD.bazel文件移动到其正确的目录,并向其中添加应用程序的依赖项。

现在,当我运行yarn build时,出现以下错误:

yarn run v1.16.0
$ ng build
INFO: Analyzed target //apps/angularchatclient/src:prodapp (1 packages loaded, 1 target configured).
INFO: Found 1 target...
ERROR: /home/user/devbox/angularchatclient/apps/angularchatclient/src/BUILD.bazel:24:1: Compiling Angular templates (ngc) //apps/angularchatclient/src:sr
c failed (Exit 1)
Error during template compile of 'AppModule'
  Function calls are not supported in decorators but 'NxModule' was called.
Error during template compile of 'AppModule'
  Function calls are not supported in decorators but 'StoreModule' was called.
Error during template compile of 'AppModule'
  Function calls are not supported in decorators but 'EffectsModule' was called.
Error during template compile of 'AppModule'
  Function calls are not supported in decorators but 'StoreDevtoolsModule' was called.
: Unexpected value 'undefined' imported by the module 'AppModule in /home/user/.cache/bazel/_bazel_user/730bcc0be51d4201a9cf443607d64bce/execroot/project/apps/angularchatclient/src/app/app.module.ts'
Error during template compile of 'AppModule'
  Function calls are not supported in decorators but 'NxModule' was called.
Error during template compile of 'AppModule'
  Function calls are not supported in decorators but 'StoreModule' was called.
Error during template compile of 'AppModule'
  Function calls are not supported in decorators but 'EffectsModule' was called.
Error during template compile of 'AppModule'
  Function calls are not supported in decorators but 'StoreDevtoolsModule' was called.

Target //apps/angularchatclient/src:prodapp failed to build
Use --verbose_failures to see the command lines of failed build steps.

我已经阅读了this related GitHub issue,但是有关更改我的tsconfig规则或为forRoot()调用声明const变量的建议并没有帮助。另外,this question is related我还缺少什么?

谢谢!

1 个答案:

答案 0 :(得分:0)

玩笑应该能正常工作,但是我在Angular 8和Bazel中遇到了ngrx相同的错误。尝试将您的angular-metadata.tsconfig.json更新为:

// WORKAROUND https://github.com/angular/angular/issues/18810
//
// This file is required to run ngc on 3rd party libraries such as @ngrx,
// to write files like node_modules/@ngrx/store/store.ngsummary.json.
//
{
    "compilerOptions": {
        "lib": [
            "dom",
            "es2015"
        ],
        "experimentalDecorators": true,
        "types": [],
        "module": "amd",
        "moduleResolution": "node"
    },
    "angularCompilerOptions": {
        "enableSummariesForJit": true
    },
    "include": [
        "node_modules/@angular/**/*",
        "node_modules/@ngrx/**/*"
    ],
    "exclude": [
        "node_modules/@ngrx/store/migrations/**",
        "node_modules/@ngrx/store/schematics/**",
        "node_modules/@ngrx/store/schematics-core/**",
        "node_modules/@angular/cdk/schematics/**",
        "node_modules/@angular/cdk/typings/schematics/**",
        "node_modules/@angular/material/schematics/**",
        "node_modules/@angular/material/typings/schematics/**",
        "node_modules/@angular/common/upgrade*",
        "node_modules/@angular/router/upgrade*",
        "node_modules/@angular/bazel/**",
        "node_modules/@angular/compiler-cli/**",
        "node_modules/@angular/**/testing/**"

    ]
}

我认为这里的关键是导入ngrx模块和enableSummariesForJit