Quokka with "ts-node" installed produces SWC error

Filyus commented 9 months ago

Issue description or question

The error happens when ts-node in active project is installed. This happens even when the code and tsconfig.json are empty.

Installing SWC helps:

npm i -D @swc/cli @swc/core

Perhaps, instead of the error, this is better to write a suggestion to install the SWC, disable it with a Quokka settings or even disable it automatically when the SWC is not installed.

Quokka.js Console Output

609\dist\wallaby\node_modules\@swc\wasm threw an error when attempting to validate swc compiler options. 
You may be using an old version of swc which does not support the options used by ts-node. 
Try upgrading to the latest version of swc. 
Error message from swc: 
undefined 
  at createVariant ./node_modules/ts-node/src/transpilers/swc.ts:259
  at createSwcOptions ./node_modules/ts-node/src/transpilers/swc.ts:201
  at create ./node_modules/ts-node/src/transpilers/swc.ts:54
  at createTranspiler ./node_modules/ts-node/src/index.ts:784
  at createTranspileOnlyGetOutputFunction ./node_modules/ts-node/src/index.ts:1341
  at createFromPreloadedConfig ./node_modules/ts-node/src/index.ts:1404
  at create ./node_modules/ts-node/src/index.ts:624
  at Object.register ./node_modules/ts-node/src/index.ts:591

There also related issue when "swc": true" is specified in tsconfig.json:

Cannot specify both 'swc' and 'transpiler' options.  'swc' uses the built-in swc transpiler.

Code editor version

Visual Studio Code v1.85.1 ts-node: 10.9.2

OS name and version

Windows 10

ArtemGovorov commented 9 months ago

Thanks for the report.

We will investigate the cause of the issue next week.

In the meantime you may disable SWC with a Quokka configuration setting.

rcoundon commented 9 months ago

I'm seeing the same issue in WebStorm 2023.3.2 with Quokka 1.0.422

/Users/rosscoundon/Library/Application Support/JetBrains/WebStorm2023.3/plugins/quokka-intellij/dist/node_modules/@swc/wasm threw an error when attempting to validate swc compiler options.
You may be using an old version of swc which does not support the options used by ts-node.
Try upgrading to the latest version of swc.
Error message from swc:
undefined
    at createVariant ./node_modules/.pnpm/ts-node@10.9.2_@types+node@20.10.6_typescript@5.3.3/node_modules/ts-node/src/transpilers/swc.ts:259
    at createSwcOptions ./node_modules/.pnpm/ts-node@10.9.2_@types+node@20.10.6_typescript@5.3.3/node_modules/ts-node/src/transpilers/swc.ts:201
    at create ./node_modules/.pnpm/ts-node@10.9.2_@types+node@20.10.6_typescript@5.3.3/node_modules/ts-node/src/transpilers/swc.ts:54
    at createTranspiler ./node_modules/.pnpm/ts-node@10.9.2_@types+node@20.10.6_typescript@5.3.3/node_modules/ts-node/src/index.ts:784
    at createTranspileOnlyGetOutputFunction ./node_modules/.pnpm/ts-node@10.9.2_@types+node@20.10.6_typescript@5.3.3/node_modules/ts-node/src/index.ts:1341
    at createFromPreloadedConfig ./node_modules/.pnpm/ts-node@10.9.2_@types+node@20.10.6_typescript@5.3.3/node_modules/ts-node/src/index.ts:1404
    at create ./node_modules/.pnpm/ts-node@10.9.2_@types+node@20.10.6_typescript@5.3.3/node_modules/ts-node/src/index.ts:624
    at Object.register ./node_modules/.pnpm/ts-node@10.9.2_@types+node@20.10.6_typescript@5.3.3/node_modules/ts-node/src/index.ts:591

smcenlly commented 9 months ago

This issue has been addressed in the latest version of Quokka for both VS Code and JetBrains editors. Please update to the latest version(s) if you're still encountering these problems.

loganpowell commented 8 months ago

Works like a charm. Thank you!!

darioprinc commented 7 months ago

hello, disabling swc in quokka config.json temporarily solves the issue:

"ts":{"swc":false}

Output:

Quokka PRO 'Untitled-1.ts' (node: v18.19.0, TypeScript: v5.1.6)

123 at quokka.ts:2:1

however without it the issue persists:

open VSCode
>Quokka.js: New TypeScript File
Output:

Quokka PRO 'Untitled-3.ts' (node: v18.19.0, TypeScript: v5.1.6 + swc) .\node_modules\@swc\core\index.js threw an error when attempting to validate swc compiler options. You may be using an old version of swc which does not support the options used by ts-node. Try upgrading to the latest version of swc. Error message from swc: Failed to deserialize buffer as swc::config::Options JSON: {"sourceMaps":true,"module":{"type":"commonjs","noInterop":false,"strictMode":true,"ignoreDynamic":false},"swcrc":false,"jsc":{"parser":{"syntax":"typescript","tsx":false,"decorators":false,"dynamicImport":true,"importAssertions":true},"target":"es2015","transform":{"legacyDecorator":true,"react":{"throwIfNamespace":false,"useBuiltins":false,"importSource":""},"useDefineForClassFields":false},"keepClassNames":false,"experimental":{"keepImportAttributes":true,"emitAssertForImportAttributes":true}}} Caused by: unknown field keepImportAttributes, expected one of plugins, keepImportAssertions, cacheRoot, disableBuiltinTransformsForInternalTesting at line 1 column 502

note: >Quokka.js: New JavaScript File works fine

smcenlly commented 7 months ago

@darioprinc - can you please share your package.json for your project that had the problem?

darioprinc commented 7 months ago

hi @smcenlly, I suppose you are after dependencies?

edited:

"devDependencies": {
  "@babel/core": "^7.16.12",
  "@babel/eslint-parser": "^7.16.5",
  "@babel/plugin-proposal-class-properties": "^7.16.7",
  "@babel/preset-env": "^7.16.11",
  "@babel/preset-react": "^7.16.7",
  "@badeball/cypress-cucumber-preprocessor": "^16.0.3",
  "@bahmutov/cypress-esbuild-preprocessor": "2.2.0",
  "@cypress/grep": "^3.1.3",
  "@storybook/addon-a11y": "^7.5.2",
  "@storybook/addon-essentials": "^7.5.2",
  "@storybook/addon-interactions": "^7.5.2",
  "@storybook/addon-themes": "^7.5.2",
  "@storybook/addons": "~7.5.2",
  "@storybook/jest": "0.2.2",
  "@storybook/react": "~7.5.2",
  "@storybook/react-webpack5": "~7.5.2",
  "@storybook/test-runner": "~0.13.0",
  "@storybook/testing-library": "~0.2.0",
  "@storybook/theming": "~7.5.2",
  "@types/pdf-parse": "^1.1.1",
  "@types/ssh2-sftp-client": "^9.0.3",
  "@types/react": "^18.0.21",
  "@typescript-eslint/eslint-plugin": "^6.0.0",
  "@typescript-eslint/parser": "^6.0.0",
  "babel-plugin-transform-import-meta": "^2.2.0",
  "codeowners": "^5.1.1",
  "commander": "^11.0.0",
  "concurrently": "^8.2.1",
  "cross-env": "^7.0.3",
  "cypress": "13.6.3",
  "cypress-fail-fast": "^7.0.0",
  "cypress-mochawesome-reporter": "^3.8.0",
  "cypress-multi-reporters": "^1.6.4",
  "cypress-real-events": "^1.7.6",
  "cypress-timestamps": "^1.2.3",
  "cypress-on-fix": "^1.0.2",
  "date-fns": "^2.30.0",
  "esbuild": "^0.18.11",
  "eslint": "^8.8.0",
  "eslint-config-prettier": "^8.4.0",
  "eslint-plugin-cypress": "^2.12.1",
  "eslint-plugin-import": "^2.26.0",
  "eslint-plugin-json": "^3.1.0",
  "eslint-plugin-prettier": "^5.0.1",
  "eslint-plugin-react": "^7.28.0",
  "eslint-plugin-react-hooks": "^4.3.0",
  "eslint-plugin-simple-import-sort": "^10.0.0",
  "find-test-names": "^1.28.14",
  "http-proxy": "^1.18.1",
  "http-server": "^14.1.1",
  "husky": "^8.0.1",
  "license-checker": "^25.0.1",
  "lint-staged": "^13.0.3",
  "mammoth": "^1.5.1",
  "markdown-it": "^13.0.1",
  "mocha-junit-reporter": "^2.0.2",
  "mysql2": "^3.6.2",
  "node-xlsx": "^0.23.0",
  "npm-run-all": "^4.1.5",
  "pdf-parse": "^1.1.1",
  "prettier": "~3.0.0",
  "rimraf": "^5.0.1",
  "shelljs": "^0.8.5",
  "ssh2-sftp-client": "^9.1.0",
  "typescript": "^5.1.6",
  "wait-on": "^7.0.1"
}

smcenlly commented 7 months ago

@darioprinc - yes, I was keen to see your dependencies. Are these all of your dependencies?

I want to confirm that these are the same dependencies for the project where you had the issue?

Your Quokka output you provided above shows:

Quokka PRO 'Untitled-3.ts' (node: v18.19.0, TypeScript: v5.1.6 + swc)

When I use your dependencies with a fresh installation of your packages, I get:

Quokka PRO 'index.ts' (node: v18.19.0, TypeScript: v4.9.5 + swc)

I'm wondering where the typescript@5.1.6 version is coming from. Quokka ships with typescript@5.3.2 and your dependencies say typescript@^4.5.5. This may be related to why the swc integration is failing.

darioprinc commented 7 months ago

@smcenlly my apologies, I took a wrong branch with different package versions. I updated my original answer with a correct package.json

smcenlly commented 7 months ago

@darioprinc - we can't reproduce the problem. We're happy to investigate further but we will need you to provide a sample project that breaks in the same way. Can you please let us know your version of Quokka? You need to be using a version of Quokka released after January 10th, 2024.

darioprinc commented 7 months ago

@smcenlly Quokka version is v1.0.627

smcenlly commented 7 months ago

That version should not have the problem. Can you please provide a sample project that breaks in the same way?

wallabyjs / quokka