typescript 指定Cypress的tsconfig.json位置

91zkwejq  于 2023-01-21  发布在  TypeScript
关注(0)|答案(5)|浏览(222)

我尝试使用Cypress w/ Typescript,但是Cypress找不到我为它创建的tsconfig.json文件。我还有一个自定义的目录结构(因为我讨厌根目录下有一堆配置文件,所以我把它们放在一个config目录下)。

项目目录结构

/
├── package.json
├── configs/
│   ├── cypress.json
├── src/
│   ├── cypress/
│   │   ├── tsconfig.json

Cypress打开命令

//  package.json

"scripts": {
    "cypress:open": "cypress open --config-file configs/cypress.json"
},

在上面的脚本中,--config-file标志告诉Cypress cypress.json配置文件的位置,这很棒,因为我可以把这个文件放在任何我想放的地方,但是,现在我需要指示Cypress在哪里找到它的tsconfig.json文件。

/configs/cypress.json(告诉Cypress cypress/目录的位置)

{
  "fixturesFolder": "src/cypress/fixtures",
  "integrationFolder": "src/cypress/integration",
  "pluginsFile": "src/cypress/plugins/index.js",
  "screenshotsFolder": "src/cypress/screenshots",
  "videosFolder": "src/cypress/videos",
  "supportFile": "src/cypress/support/index.js"
}

// is there no option to set tsconfig.json path????

官方文档说把它放在cypress/目录下,根据文档,它应该在/cypress/tsconfig.json目录下,但是在我的项目中,它在/src/cypress/tsconfig.json目录下。
以下是我尝试放置tsconfig.json文件的位置:

/src/cypress/tsconfig.json //Error: "Couldn't find tsconfig.json. tsconfig-paths will be skipped"

/src/tsconfig.json //Error: "Couldn't find tsconfig.json. tsconfig-paths will be skipped"

/cypress/tsconfig.json //Error: "Couldn't find tsconfig.json. tsconfig-paths will be skipped"

/tsconfig.json // Works!! But not where I want this file to live...

我如何指示Cypress在哪里查找我想要它使用的tsconf.json文件?cypress.json配置文件中是否有一个选项,或者我可以使用的CLI标志?
我不想在我的项目根目录下放置各种各样的配置文件,实际上我的项目和测试套件有不同的tsconfig文件,最好显式地设置文件路径。

2ic8powd

2ic8powd1#

虽然这不是你想听到的答案,但是tsconfig.json将一个目录标记为一个typescript项目的根目录,就像package.json将一个目录标记为node.js项目的根目录一样,这些文件有助于IDE之类的工具理解你的项目。
在我看来,你应该只考虑移动tsconfig.json时,你开始把你的package.json在一些其他的文件夹以及。
另请参阅:https://www.typescriptlang.org/docs/handbook/tsconfig-json.html

czq61nw1

czq61nw12#

请参阅Cypress Real World Appa payment application to demonstrate real-world usage of Cypress testing methods, patterns, and workflows
它是用create-react-app和TypeScript构建的,用于Cypress的tsconfig.json位于cypress目录中。
您可能需要配置一个root tsconfig.json,并像在RWA中那样从cypress tsconfig.json扩展它。

// cypress/tsconfig.json
{
  "extends": "../tsconfig.json",
  // ...
}
wqnecbli

wqnecbli3#

尝试以下命令是否有效:

//CD to the space you want your .tsconfig 
    cd project_config  
     
  // Create .tsconfig   
     tsc --init  
    
  // Specify were you want to run your tsconfig file from
     tsc -p /path/to/folder/with/tsconfig
o2gm4chl

o2gm4chl4#

这可以在没有根级别tsconfig的情况下实现。我们的想法是在运行open命令之前可以将cd放入我们的test文件夹:
使用下面的文件结构,您的test命令将类似于:

cd ./src/cypress && cypress open --config-file ../../configs/cypress.json
/
├── package.json
├── configs/
│   ├── cypress.json
├── src/
│   ├── cypress/
│   │   ├── tsconfig.json

只需确保更新cypress.json中的支持路径等,它们现在将相对于src/cypress

mrwjdhj3

mrwjdhj35#

您的cypress文件夹应位于包含src文件夹的同一目录中,而不是位于src文件夹中。此外,您的cypress.config.ts文件应位于同一根文件夹中。
然后,您应该有一个./cypress/tsconfig.json,如下所示:

{
  "extends": "../tsconfig.json",
  "files": [
    "**/*.ts",
    "../cypress.config.ts"
  ],
  "compilerOptions": {
    "sourceMap": false,
    "types": ["cypress", "chai"]
  }
}

相关问题