babelLocations is not defined

[farzadso]

Issue description or question

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

When I open a new JS/TS file in Quokka, I get the following error when it boots up: babelLocations is not defined

And the strange thing is that it only happens when one of my projects is open. It doesn't happen when I have other projects opened or even when I have no projects opened.

Sample code

console.log('test')

Quokka.js Console Output

​​​​​Quokka 'Untitled-3.js' (node: v16.11.1)​​​​
babelLocations is not defined 

Code editor version

Visual Studio Code v1.81.1

OS name and version

Windows 11

[ArtemGovorov]

Thanks for reporting the issue. It's now fixed and the fix is published in v1.0.559.

[farzadso]

Thanks for reporting the issue. It's now fixed and the fix is published in v1.0.559.

That was fast. Thanks, but it's still showing the old version on VSCode Marketplace.

[ArtemGovorov]

The new version has been published, it typically takes the Marketplace 2-5 minutes before making it available. It should be available now.

[farzadso]

The new version has been published, it typically takes the Marketplace 2-5 minutes before making it available. It should be available now.

Thanks. The previous issue is resolved, but now it's throwing a new error:

​​​​​Quokka 'Untitled-2.ts' (node: v16.11.1)​​​​
Configured to use babel, but can not find babel-core or @babel/core module 
Babel core is not found 
 
Tried to search for babel core in these folders: 
  ./node_modules/@babel/core 
  ./node_modules/babel-core 
  /home/farzad/.quokka/node_modules/@babel/core 
  /home/farzad/.quokka/node_modules/babel-core 

[ArtemGovorov]

It looks like you have configured Quokka to use Babel in one of the Quokka config files, however this particular project doesn't have Babel installed, neither Quokka global folder, hence the error. Please check your Quokka config to either remove the setting to always use Babel, or, if it's desired to use it, install Babel core in your project or Quokka global folder (at /home/farzad/.quokka/).

[farzadso]

It looks like you have configured Quokka to use Babel in one of the Quokka config files, however this particular project doesn't have Babel installed, neither Quokka global folder, hence the error. Please check your Quokka config to either remove the setting to always use Babel, or, if it's desired to use it, install Babel core in your project or Quokka global folder (at /home/farzad/.quokka/).

My project is a "create react app" project using the default typescript template. I created the same boilerplate project a few weeks ago and instantly used Quokka out of the box without any configuration whatsoever. I feel like something else is blocking Quokka from running properly.

Sidenote: Why is Quokka so dependent on the project structure? Shouldn't it be independent?

[ArtemGovorov]

My project is a "create react app" project using the default typescript template

In this case Quokka is automatically configured to use Babel to compile TypeScript because it detects CRA generated project (and CRA is using Babel to compile TypesScript). Because of that, Quokka is expecting to find ./node_modules/@babel/core module installed in your project to be able to use it.

We have just tried Quokka in a freshly generated CRA + Typescript template and it's working as expected. I suspect that (as the error says) Quokka can not find the ./node_modules/@babel/core in your project for some reason. Please double check if the module exists/installed.

Why is Quokka so dependent on the project structure? Shouldn't it be independent?

Generally speaking, Quokka doesn't depend on a project structure much. Sometimes however we automatically configure Quokka for popular project templates, such as CRA and Vite generated apps. So in order to support CRA template without any additional configuration (such as TypeScript compiled via Babel as CRA is doing), Quokka is trying to self-configure.