Angular 迁移(从 4 到 6)e2e --proxy-config 不工作

Angular migration (from 4 to 6) e2e --proxy-config not working

我目前一直在将我的应用程序从 4 迁移到 6,但我无法执行我的代理脚本 我的 e2e 测试

脚本清单如下所示:

"scripts": {
    "ng": "ng",
    "start": "ng serve",
    "start:tst1": "ng serve --proxy-config config/proxy/proxy.tst1.json",
    "start:tst5": "ng serve --proxy-config config/proxy/proxy.tst5.json",
    ...
    "test:watch": "ng test",
    "lint": "ng lint --type-check true",
    "e2e": "ng e2e",
    "e2e:tst1": "ng e2e --proxy-config config/proxy/proxy.tst1.json",
    "e2e:tst5": "ng e2e --proxy-config config/proxy/proxy.tst5.json",
  },

我不明白的是,启动命令 (ng serve) 工作得很好,例如 npm run start:tst5。但是当我尝试执行像 npm run e2e:tst5 这样的 e2e 测试时,它会抛出错误:Unknown option: '--proxyConfig'.

我的 angular.json 中的配置如下所示:

angular.json

...
"lmsbo-bo-e2e": {
  "root": "e2e",
  "sourceRoot": "e2e",
  "projectType": "application",
  "architect": {
    "e2e": {
      "builder": "@angular-devkit/build-angular:protractor",
      "options": {
        "protractorConfig": "e2e/protractor.conf.js",
        "devServerTarget": "lmsbo-bo:serve"
      },
        "configurations": {
            "production": {
                "devServerTarget": "lmsbo-bo:serve:production"
            }
        }
    },
  ...

编辑

我在 angular.cli:

中进行了以下添加的 e2e 测试
        "serve": {
            "builder": "@angular-devkit/build-angular:dev-server",
            "options": {
                "browserTarget": "lmsbo-bo:build",
                "proxyConfig": "config/proxy/proxy.tst5.json" <== **added this** line
            },
            "configurations": {
                "production": {
                    "browserTarget": "lmsbo-bo:build:production"
                }
            }
        },

但是这种解决方法无论如何都不能令人满意。每次我想针对另一个环境执行时,我都必须更改这行代码。我宁愿通过命令行编写如下内容来管理它:ng serve --proxy-config config/proxy/proxy.tst5.json.

尽管不再支持此功能并且 github 上已经存在未解决的问题,但我发现了一种非常方便的方法来通过 script:[=17= 执行代理配置]

添加您的 package.json 以下行(示例):

"e2e:local": "ng config projects.**yourAppName**.architect.serve.options.proxyConfig **yourProxyFile1** && ng e2e && ng config projects.**yourAppName**.architect.serve.options.proxyConfig ''",
"e2e:tst1": "ng config config projects.**yourAppName**.architect.serve.options.proxyConfig **yourProxyFile2** && ng e2e && ng config projects.**yourAppName**.architect.serve.options.proxyConfig ''"

您所要做的就是通过 ng 命令在 angular.json 中设置 proxyConfig 值,并在 e2e 测试完成后重置它。确保 ng 命令正常工作(如果没有将 angular/cli 路径添加到操作系统的环境属性中并重新启动计算机)。

您可以通过如下更新 angular.json 来完成此操作(用您的项目名称替换 my-project):

1) 在项目 -> my-project-e2e 中,从

更新 devServerTarget
"my-project:serve" 

"my-project:serve:e2e"

2) 在项目 -> 我的项目 -> 架构师 -> 配置中,添加

"e2e": {
          "browserTarget": "cli-advisor-portal:build:e2e",
          "proxyConfig": "proxy.local.config.json"
        }

如果我没理解错的话——你想避免每次要运行针对不同环境进行端到端测试时都必须更改代理配置行:

为您的环境创建单独的代理配置,例如:

  • proxy.config.yourenv1.json
  • proxy.config.yourenv2.json

serve下的每个环境添加配置:

"serve": { ... "configurations": { "yourenv1-e2e": { "browserTarget": "yourapp:build", "proxyConfig": "proxy.config.yourenv1.json" }, "yourenv2-e2e": { "browserTarget": "yourapp:build", "proxyConfig": "proxy.config.yourenv2.json" } } },

然后在yourapp-e2e下再次添加各个环境的配置:

"yourapp-e2e": {
  ...
  "architect": {
    "e2e": {
      ...
      "configurations": {
        "yourenv1-e2e": {
          "devServerTarget": "yourapp:serve:yourenv1-e2e"
        },
        "yourenv2-e2e": {
          "devServerTarget": "yourapp:serve:yourenv2-e2e"
        },
      }
    },

现在你可以简单地运行这个:

ng e2e --configuration yourenv-e2e

e2e 测试将运行 使用所需的代理配置文件。
基于@raymondboswel 的回答。