cypress config migration - export declare function __extends(d: Function, b: Function): void

Current behavior

I updated to cypress 10 today, and I am seeing below error message after cypress UI has offered me to automatically migrate my cypress.json to cypress.config.js/ts. The UI created the TS file successfully, but then I tried to set up component testing and the UI displays the error.

This is the created config file:

import { defineConfig } from 'cypress';

export default defineConfig({
    projectId: 'wdenbx',
    experimentalSourceRewriting: false,
    video: false,
    chromeWebSecurity: false,
    retries: {
        runMode: 3,
        openMode: 0,
    },
    env: {
        CY_BASE_URL: 'http://localhost:8080',
        CY_TIMEOUT: 60000,
        CY_WAIT_SHORT: 4000,
        CY_WAIT_MEDIUM: 6000,
        CY_WAIT_LONG: 9000,
        PERCY_TOKEN: "",
        PERCY_LOGIN_USERNAME: 'user',
        PERCY_LOGIN_PASSWORD: 'pw',
        PERCY_CUSTOMER_ID: '',
        PERCY_SECURITY_FIELD: '',
    },

    fixturesFolder: 'tests/e2e/fixtures',
    screenshotsFolder: 'tests/e2e/screenshots',
    videosFolder: 'tests/e2e/videos',

    e2e: {
        // We've imported your old cypress plugins here.
        // You may want to clean this up later by importing these.
        // setupNodeEvents(on, config) {
         //   return require('./tests/e2e/plugins/index.js')(on, config);
        // },
        specPattern: 'tests/e2e/specs/**/*.{js,jsx,ts,tsx}',
        supportFile: 'tests/e2e/support/index.js',
    },

    component: {
        supportFile: 'tests/e2e/support/component.ts',
        devServer: {
            framework: 'vue-cli',
            bundler: 'webpack',
        },
    },
});

Debug logs

/home/user/frontend/node_modules/tslib/tslib.d.ts:22
export declare function __extends(d: Function, b: Function): void;
^^^^^^

SyntaxError: Unexpected token 'export'
    at Object.compileFunction (node:vm:360:18)
    at wrapSafe (node:internal/modules/cjs/loader:1055:15)
    at Module._compile (node:internal/modules/cjs/loader:1090:27)
    at Module._extensions..js (node:internal/modules/cjs/loader:1180:10)
    at Object.require.extensions. [as .ts] (/home/user/.cache/Cypress/10.7.0/Cypress/resources/app/node_modules/ts-node/src/index.ts:1445:43)
    at Module.load (node:internal/modules/cjs/loader:1004:32)
    at Function.Module._load (node:internal/modules/cjs/loader:839:12)
    at Module.require (node:internal/modules/cjs/loader:1028:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object. (/home/user/.cache/Cypress/10.7.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/devServer.js:5:17)
    at Module._compile (node:internal/modules/cjs/loader:1126:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1180:10)
    at Module.load (node:internal/modules/cjs/loader:1004:32)
    at Function.Module._load (node:internal/modules/cjs/loader:839:12)
    at Module.require (node:internal/modules/cjs/loader:1028:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object. (/home/user/.cache/Cypress/10.7.0/Cypress/resources/app/node_modules/@packages/server/node_modules/@cypress/webpack-dev-server/dist/index.js:4:21)
    at Module._compile (node:internal/modules/cjs/loader:1126:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1180:10)
    at Module.load (node:internal/modules/cjs/loader:1004:32)
    at Function.Module._load (node:internal/modules/cjs/loader:839:12)
    at Module.require (node:internal/modules/cjs/loader:1028:19)

### Cypress Version

10.7.0

### Node version

16.17.0

### Package Manager

npm

### Package Manager Version

8.18.0

### Operating system

Linux

### Operating System Version

Ubuntu 20.04.5 LTS

### Other

I updated from 9.7.0

[amehta265]

@snake-py Thank you for putting something together. I can confirm that I can reproduce this problem on my end.

Upon further investigation, the problem stems from tslib setup in the tsconfig.json file specifically declaring a particular path ("tslib": ["node_modules/tslib/tslib.d.ts"]) for tslib as you have done in your config file.

A simple workaround would be to remove this tslib path all together from your tsconfig.json. According to the tslib documentation you do not need to specify a path in your case but instead just set the importHelpers flag which you have already done. Furthermore, if you update your path to "tslib": "[node_modules/tslib/]", this does the trick as well.

I am looking at how this might relate to the way Cypress handles typescript configurations but I hope that this work around suffices for now

[snake-py]

@amehta265 thank you for pointing out the workaround. This seems sufficient enough for me.