SyntaxError: Unexpected token { - Error when converting WebDriverio project to Typrscript

SyntaxError: Unexpected token { - Error when converting WebDriverio project to Typrscript

我正在尝试按照 https://webdriver.io/docs/typescript.html 并收到错误消息 "Unexpected toke { " 将我的 webdriver.io + cucumber 项目转换为 Typescript。 我正在使用 WebDriver.io + TypeScript + Cucumber。

在 wdio.conf.js 中,我有如下 cucumberOpts

cucumberOpts: {
    requireModule: [
            'tsconfig-paths/register',
        () => { require('ts-node').register({files: true}) },
    ],
    require: ['./src/step_definitions/*.ts'],
    backtrace: false,   
    requireModule: [],
    dryRun: false,      
    failFast: false,    
    format: ['pretty'], 
    colors: true,       
    snippets: true,     
    source: true,       
    profile: [],        
    strict: false,      
    tags: [],           
    timeout: 60000,     
    ignoreUndefinedDefinitions: false,
},

我的 tsconfig.json 如下所示

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "esModuleInterop": true,
    "removeComments": true,
    "noImplicitAny": false,
    "outDir": "dist",
    "baseUrl": ".",
    "paths": {
        "*": [ "./*" ],
        "src/*": ["./src/*"]
    },
    "types": ["node", "@wdio/sync","jest"]
  },

  "include": [
      "./src/**/*"
  ]
}

我的文件夹结构如下

src/features/
src/step_definitions
src/pageObjects

我的 Step 定义的第一个语句如下

step.ts

import { Given, When, Then } from "cucumber";

Package.json

"scripts": {
    "test":"./node_modules/.bin/wdio wdio.conf.js"
  },

当我 运行 我的测试时,我在 step.ts.

的第一行收到错误消息“SyntaxError: Unexpected token {”

如何修复此错误。

老实说,您的 tsconfig.json 配置文件看起来不错,我唯一关心的是 "target" 编译器选项。

通常, 使用 "target": "es6" 选项,将注入以下库列表:DOM , ES6, DOM.Iterable & ScriptHost.所以 import 应该不会抛出任何错误,因为包含了 ES6 模块库。

我会尝试通过 "lib" compiler option.

向编译器明确建议库

以下对我有用:

{
  "compilerOptions": {
    "lib": [
        "dom",
        "es7" // or es2016, es2017, es2018 ...
    ],
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "esModuleInterop": true,
    "removeComments": true,
    "noImplicitAny": false,
    "outDir": "dist",
    "baseUrl": ".",
    "paths": {
        "*": [ "./*" ],
        "src/*": ["./src/*"]
    },
    "types": ["node", "@wdio/sync","jest"]
  },

!注:其他库版本包括:'ES3'默认)、'ES5''ES2015''ES2016''ES2017''ES2018''ESNEXT'.

我通过将 Typescript 文件编译为 Javascript 文件然后在 cucumberOpts => require

中提供 Javascript 文件的位置来让它工作