cypress component test can not run correctly

Describe the bug

When i used cypress + vite + vite-plugin-windicss + sass + vue3 try to do component test, i find it could not run correctly. I execute "cypress open-ct" command, after a while, occured an error. The error message as below: cypress

It seems 'vite-plugin-windicss' or 'windicss' has a bug, I am not sure that. Really need you help, thanks.

Minimal Reproductions

https://gitee.com/maxwell0401/windicss-bug-reproduce-demo

Versions

vite-plugin-windicss: 1.5.4
vite: 2.6.14
framework(vue/react/svelte/etc): vue - 3.2.23

Additonal Context

package.json

"devDependencies": {
    "@commitlint/cli": "^11.0.0",
    "@cypress/vite-dev-server": "^2.2.1",
    "@cypress/vue": "^3.0.5",
    "@interactjs/types": "^1.10.11",
    "@intlify/vite-plugin-vue-i18n": "^2.4.0",
    "@types/lodash-es": "^4.17.3",
    "@types/node": "^16.11.1",
    "@vitejs/plugin-vue": "^1.9.3",
    "@vitejs/plugin-vue-jsx": "^1.1.6",
    "@windicss/plugin-animations": "^1.0.9",
    "@windicss/plugin-scrollbar": "^1.2.3",
    "autoprefixer": "^10.2.6",
    "babel-plugin-component": "^1.1.1",
    "babel-plugin-import": "^1.13.3",
    "commitizen": "^4.2.3",
    "commitlint-config-cz": "^0.13.2",
    "cross-env": "^7.0.3",
    "cypress": "^9.1.0",
    "cz-customizable": "^6.3.0",
    "eslint": "^8.1.0",
    "husky": "^4.3.8",
    "jest": "^27.3.1",
    "lint-staged": "^10.5.3",
    "postcss": "^8.2.6",
    "postcss-import": "^14.0.0",
    "prettier": "^2.4.1",
    "rimraf": "^3.0.2",
    "sass": "^1.44.0",
    "typescript": "^4.2.4",
    "unplugin-auto-import": "^0.4.12",
    "unplugin-element-plus": "^0.1.3",
    "unplugin-vue-components": "^0.17.2",
    "vite-plugin-optimize-persist": "^0.1.0",
    "vite-plugin-package-config": "^0.0.3",
    "vite-plugin-restart": "^0.0.2",
    "vite-plugin-windicss": "^1.5.4",
    "tslib": "^2.3.1",
    "vite": "^2.6.14"
  }

cypress / plugins / index.ts


const { startDevServer } = require('@cypress/vite-dev-server')

module.exports = (on, config) => { on('dev-server:start', (options) => startDevServer({ options })) return config }

@cizkey Hi, After debugging under the repository, it should not be related to windicss.

cypress itself uses tsconfig-pathsto handle the paths mapping in tsconfig.json. tsconfig-paths will use pattern * as fallback by default, trying to match all paths relative to baseUrl.

https://github.com/dividab/tsconfig-paths/blob/master/src/mapping-entry.ts#L42

It just so happens that you have a windicss/index.ts in the root directory of your repository, which causes cypress to resolve the require('windicss') in vite-plugin-windicss to this directory, resulting in the error in the above.

Just need to change the name of the windicss directory in your repository and it should work.

I'm not sure if node_modules can be ignored when match paths in tsconfig-paths, if anyone knows, please let me know, thanks!

windicss / vite-plugin-windicss

cypress component test can not run correctly #259