stackblitz / tutorialkit

TutorialKit by StackBlitz - Create interactive tutorials powered by the WebContainer API
https://tutorialkit.dev
MIT License
232 stars 22 forks source link

Vite CJS build warning caused by import of `unoCSSConfig` from `@tutorialkit/astro` #244

Closed AriPerkkio closed 2 weeks ago

AriPerkkio commented 1 month ago

Describe the bug

When TutorialKit is started in development or build mode, Vite's CJS build entrypoint error is shown:

$ pnpm dev
...
The CJS build of Vite's Node API is deprecated. See https://vitejs.dev/guide/troubleshooting.html#vite-cjs-node-api-deprecated for more details.

Steps to reproduce

$ pnpm create tutorial

$ pnpm dev
...
The CJS build of Vite's Node API is deprecated. See https://vitejs.dev/guide/troubleshooting.html#vite-cjs-node-api-deprecated for more details.
$ code uno.config.ts

- import { unoCSSConfig } from '@tutorialkit/astro';

export default defineConfig({
-  ...unoCSSConfig,
$ pnpm dev

# No warnings

Expected behavior

No warning should be shown

Platform

henrikvilhelmberglund commented 1 month ago

Not sure why but seems to be caused by spreading ...unoCSSConfig instead of using the variables from import { rules, shortcuts, theme } from "@tutorialkit/theme";

The UnoCSS config could also be made into a preset if that's easier:

presetTutorialKit.ts

import { definePreset } from "unocss"
import { rules, shortcuts, theme } from "@tutorialkit/theme";

export default definePreset(() => {
  return {
    name: 'presetTutorialKit',
    rules,
    shortcuts,
    theme
  }
})

uno.config.ts (removing ...unoCSSConfig)

  presets: [
    presetUno({
      dark: {
        dark: '[data-theme="dark"]',
      },
    }),
    presetTutorialKit(),
AriPerkkio commented 1 month ago

I think this is happening when unocss imports the uno.config.ts, and that file imports '@tutorialkit/astro' that has imports for Astro stuff. Not sure why unocss decides to use CJS here.

We are planning to move most, if not all (?) uno.config.ts inside @tutorialkit/* packages so that end-users wouldn't have to maintain that file. Ideally tutorials wouldn't even have to create uno.config.ts unless they explicitly wanted to extend that. There's some discussion on https://github.com/stackblitz/tutorialkit/issues/144.