Quokka ignoring every typescript compiler options

reimakesgames commented 10 months ago

Issue description or question

Is this issue related to Quokka not outputting the expected results of your code?: Yes

Quokka cannot compile the files I want tested with the following error;

⨯ Unable to compile TypeScript: 
error TS5095: Option 'bundler' can only be used when 'module' is set to 'es2015' or later.
 
 
  at Object.<anonymous> src/engine/modules/App.ts:1

But I have set in my tsconfig.json and .quokka the following lines;

...
    "target": "ES2022",
...
    "moduleResolution": "Bundler",
    "module": "ES2022",
...

...es2022 is literally newer than es2015, why does it not work?

tsconfig.json, .quokka

My global quokka config file only has {"pro": false} in it

What's weirder is that when done on a fresh directory, it works as expected?

I am a teenager hobbyist and I don't know what I'm supposed to do with this.

Sample code

I cannot provide a sample code as it doesn't compile on any file in my project

Sample repository link

I can't provide a sample since when doing on a fresh project, it works as intended, and I have 0 idea where the issue stems from. So here's my project repository

Quokka.js Console Output

⨯ Unable to compile TypeScript: 
error TS5095: Option 'bundler' can only be used when 'module' is set to 'es2015' or later.
 
 
  at Object.<anonymous> src/engine/modules/App.ts:1

Code editor version

Visual Studio Code v1.84.2

OS name and version

Windows 10 22H2 (OS Build 19045.3570)

smcenlly commented 10 months ago

Thanks for your interest in Quokka.js, and for the sample project.

Some background: Quokka executes your code in node.js and in order to do that, it needs to first transform it to JavaScript.

Quokka detects how your code is supposed to run in node.js based on your package.json "type": "commonjs/module" setting. It defaults to commonjs. In your case, Quokka is overriding your TypeScript setting so that it can execute your code (based on your package.json config).

You can fix your problem by adding "type": "module" to your package.json, but there are still a couple of additional steps to start executing your code:

Your project bundles your code at runtime using tsup, but Quokka cannot run your code like this. Instead, you'll need to transform your code another way. I can see that your project is already using vite/vitest; we recommend that you install vite-node to run your project. You can do this by installing vite-node as a dependency (npm install vite-node).
You no longer need your .quokka configuration. In fact, it's going to cause problems for you. You should replace it with:
```
{
"plugins": ["jsdom-quokka-plugin"]
}
```
The plugins section tells Quokka to emulate a browser-like environment, as your code requires browser features.

Unfortunately, you're still going to run into some problems when running your code (even with these settings), because the runtime environment that your code is expecting (i.e. via electron) is not the same as when it runs in node.js.

I think you will find the best use of Quokka for your project/scenario is going to be to run isolated pieces of code that don't have electron runtime dependencies. For example, if you're experimenting with a smaller algorithm / function, you can quickly test it in a separate Quokka file, and then update your code once you're happy with it.

reimakesgames commented 10 months ago

Noted! Thank you so much for the help! <3

wallabyjs / quokka