无Angular CLI配置Angular E2E测试遇语法错误求助

你的错误SyntaxError: Unexpected token import核心原因是：Node.js直接尝试执行未转译的TypeScript代码（import是TS/ES6语法，Node默认不识别），说明你的TS文件没有被ts-node正确转译。下面是一步步的修复方案：

1. 修正Protractor配置文件的结构错误 #

你的protractor.conf.js里directConnect被错误地放在了capabilities对象内部，这会导致Protractor无法正确解析配置，进而影响ts-node的初始化。把它移到capabilities外面：

const {SpecReporter} = require('jasmine-spec-reporter');

exports.config = {
  allScriptsTimeout: 11000,
  specs: [
    './e2e/**/*.e2e-spec.ts'
  ],
  capabilities: {
    'browserName': 'chrome'
  },
  // 把directConnect移到这里
  directConnect: true,
  baseUrl: 'http://localhost:4200/',
  framework: 'jasmine',
  jasmineNodeOpts: {
    showColors: true,
    defaultTimeoutInterval: 30000,
    print: function () { }
  },
  onPrepare() {
    require('ts-node').register({ 
      project: 'e2e/tsconfig.e2e.json' 
    });
    jasmine.getEnv().addReporter(new SpecReporter({spec: {displayStacktrace: true}}));
  }
}

2. 修复tsconfig.e2e.json的编译配置 #

你的根目录tsconfig.json设置了"noEmit": true，这个配置会被tsconfig.e2e.json继承，导致ts-node无法生成转译后的JS文件。需要在tsconfig.e2e.json里显式覆盖这个配置：

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/e2e",
    "module": "commonjs",
    "target": "es5",
    "types": [
      "jasmine",
      "jasminewd2",
      "node"
    ],
    // 显式关闭noEmit，允许ts-node编译TS
    "noEmit": false
  }
}

3. 验证ts-node的注册逻辑 #

确保在onPrepare中ts-node的project路径正确（相对于Protractor配置文件的位置，也就是根目录，所以'e2e/tsconfig.e2e.json'是正确的）。如果还是有问题，可以尝试添加compilerOptions强制指定模块格式：

require('ts-node').register({ 
  project: 'e2e/tsconfig.e2e.json',
  compilerOptions: {
    module: 'commonjs'
  }
});

4. （可选）确保服务器完全启动后再运行测试 #

虽然这不是当前错误的直接原因，但如果服务器还没完全启动就跑E2E测试，后续可能会遇到连接失败的问题。可以安装wait-on工具：

npm install wait-on --save-dev

然后修改启动命令，先等待服务器就绪：

npm-run-all -p server:prod:ci wait-for-server --race protractor

在package.json里添加wait-for-server脚本：

"scripts": {
  // ...其他脚本
  "wait-for-server": "wait-on http://localhost:4200/"
}

完成以上步骤后，重新运行你的E2E测试命令，应该就能正常转译TS文件并执行测试了。

内容的提问来源于stack exchange，提问作者Flyii