picomatch/posix.js does not provide an export 'default' on new install via CLI.

[x8BitRain]

Describe the bug

Initing a new project via npm create tutorial and starting the project results in

[astro-island] Error hydrating /node_modules/@tutorialkit/astro/dist/default/components/WorkspacePanelWrapper.tsx SyntaxError: The requested module '/node_modules/picomatch/posix.js?v=376cec49' does not provide an export named 'default' (at tutorial-runner.js?v=376cec49:1:8)

in the browser, without any modification to the project.

The demo project does not start and is stuck on "Preparing Environment".

This happens with npm, pnpm and bun, also tried to manually install picomatch and create a vite alias without success.

Link to a StackBlitz project which shows the error

No response

Steps to reproduce

1. Run npm create tutorial, enter all default options
2. Wait for localhost to open in browser
3. check console.

Expected behavior

The default project should start without error.

Screenshots

Platform

• TutorialKit version: 4.15.0
• OS: Macos
• Browser: Lastest chrome
• Version: 131

Additional context

No response

[AriPerkkio]

This was introduced in version 1.2.0 in #394. The version 1.1.1 should work fine.

Looks like also pnpm build; pnpm preview works just fine, it's just the development mode pnpm dev when Vite fails to resolve default export for the CJS depedency. 🤔

[AriPerkkio]

Another work-around for now is to add this in your astro.config.ts:

import tutorialkit from "@tutorialkit/astro";
import { defineConfig } from "astro/config";

export default defineConfig({
  devToolbar: {
    enabled: false,
  },
  integrations: [tutorialkit()],
+ vite: {
+   optimizeDeps: {
+     include: ["@tutorialkit/astro > picomatch/posix.js"],
+   },
+ },
});

[AriPerkkio]

Fixed in version 1.2.1.

[innerdaze]

Still have this issue when using yarn 1.22 - upgrading to latest yarn resolves