我在配置 Cypress 以在我的 Vite 应用程序上进行组件测试时遇到问题

Question

我正在尝试配置 Cypress 以在我最近完成的 Vite 应用程序上进行组件测试。不幸的是，Cypress 正在应用程序的根文件夹中查找 vite.config.js，而不是存储 vite.config.js 的客户端文件夹。有谁知道如何解决这个问题吗？

我尝试将配置文件移动到根文件夹，这允许我配置 Cypress 进行组件测试，但这会在我运行应用程序时扰乱构建过程。

Answer 1

这可能不是您所需要的全部，但请参阅此处的示例

cypress.config.js

vite-dev-server，它从指定位置显式加载 vite.config。

尝试在

require()

参数中设置您的特定路径。

import { devServer } from '@cypress/vite-dev-server'
import { defineConfig } from 'cypress'

export default defineConfig({
  component: {
    devServer(devServerConfig) {
      return devServer({
        ...devServerConfig,
        framework: 'react',
        viteConfig: require('./vite.config.js')
      })
    }
  }
})

我还看到它解析了上面传递的配置：createViteDevServerConfig

  const { 
    viteConfig: inlineViteConfig,     // this is the config file require()'d above
    cypressConfig: { projectRoot } 
  } = config
  let resolvedOverrides: InlineConfig = {}

  if (inlineViteConfig) {
    debug(`Received a custom viteConfig`, inlineViteConfig)

    if (typeof inlineViteConfig === 'function') {
      resolvedOverrides = await inlineViteConfig()
    } else if (typeof inlineViteConfig === 'object') {
      resolvedOverrides = inlineViteConfig                  // ... used here
    }

    // Set "configFile: false" to disable auto resolution of <project-root>/vite.config.js
    resolvedOverrides = { configFile: false, ...resolvedOverrides }
  } else {
...