fix: build error Error [ERR_MODULE_NOT_FOUND] .vitepress/.temp/style.…

…l0sNRNKZ.js Cannot find module '/Users/neko/Git/nolebase/integrations/docs/.vitepress/.temp/style.l0sNRNKZ.js' imported from /Users/neko/Git/nolebase/integrations/docs/.vitepress/.temp/app.js Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/Users/neko/Git/nolebase/integrations/docs/.vitepress/.temp/style.l0sNRNKZ.js' imported from /Users/neko/Git/nolebase/integrations/docs/.vitepress/.temp/app.js Already fixing: [Bug Report] 5.2.12 regression - dynamic css import will cause MODULE_NOT_FOUND in SSR build · Issue #17366 · vitejs/vite vitejs/vite#17366 Signed-off-by: Neko Ayaka <[email protected]>
nolebase · Jun 3, 2024 · 725ee7b · 725ee7b
1 parent 3fa55fe
commit 725ee7b
Show file tree

Hide file tree

Showing 44 changed files with 563 additions and 262 deletions.
diff --git a/docs/.vitepress/theme/index.ts b/docs/.vitepress/theme/index.ts
@@ -3,7 +3,7 @@ import { type Plugin, h } from 'vue'
 import { MotionPlugin } from '@vueuse/motion'
 import TwoslashFloatingVue from '@shikijs/vitepress-twoslash/client'
 
-import { NuLazyTeleportRiveCanvas } from '@nolebase/ui'
+import { NuLazyTeleportRiveCanvas } from '@nolebase/ui-rive-canvas'
 import { defineThemeUnconfig } from '@nolebase/unconfig-vitepress'
 import { NolebasePluginPreset } from '@nolebase/unconfig-vitepress/plugins'
 

diff --git a/docs/package.json b/docs/package.json
@@ -20,6 +20,8 @@
     "@nolebase/markdown-it-element-transform": "workspace:^",
     "@nolebase/markdown-it-unlazy-img": "workspace:^",
     "@nolebase/ui": "workspace:^",
+    "@nolebase/ui-asciinema": "workspace:^",
+    "@nolebase/ui-rive-canvas": "workspace:^",
     "@nolebase/unconfig-vitepress": "workspace:^",
     "@nolebase/vitepress-plugin-enhanced-mark": "workspace:^",
     "@nolebase/vitepress-plugin-enhanced-readabilities": "workspace:^",
@@ -44,6 +46,6 @@
     "motion": "^10.17.0",
     "thumbhash": "^0.1.1",
     "unlazy": "^0.11.3",
-    "vite-plugin-vue-devtools": "^7.2.1"
+    "vite-plugin-vue-devtools": "^7.1.3"
   }
 }
diff --git a/docs/pages/en/integrations/markdown-it-bi-directional-links/getting-started.md b/docs/pages/en/integrations/markdown-it-bi-directional-links/getting-started.md
@@ -45,6 +45,7 @@ export default defineConfigWithTheme({
   },
   markdown: {
     config: (md) => {
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(BiDirectionalLinks()) // [!code ++]
     },
   },

diff --git a/docs/pages/en/integrations/vitepress-plugin-enhanced-readabilities/index.md b/docs/pages/en/integrations/vitepress-plugin-enhanced-readabilities/index.md
@@ -85,11 +85,6 @@ import { defineConfig } from 'vitepress'
 export default defineConfig({
   vite: { // [!code ++]
     optimizeDeps: { // [!code ++]
-      include: [ // [!code ++]
-        // @rive-app/canvas is a CJS/UMD module, so it needs to be included here // [!code ++]
-        // for Vite to properly bundle it. // [!code ++]
-        '@nolebase/vitepress-plugin-enhanced-readabilities > @nolebase/ui > @rive-app/canvas', // [!code ++]
-      ], // [!code ++]
       exclude: [ // [!code ++]
         '@nolebase/vitepress-plugin-enhanced-readabilities/client', // [!code ++]
       ], // [!code ++]
@@ -122,11 +117,6 @@ import { defineConfig } from 'vite'
 export default defineConfig(() => {
   return {
     optimizeDeps: {
-      include: [ // [!code ++]
-        // @rive-app/canvas is a CJS/UMD module, so it needs to be included here // [!code ++]
-        // for Vite to properly bundle it. // [!code ++]
-        '@nolebase/vitepress-plugin-enhanced-readabilities > @nolebase/ui > @rive-app/canvas', // [!code ++]
-      ], // [!code ++]
       exclude: [ // [!code ++]
         '@nolebase/vitepress-plugin-enhanced-readabilities/client', // [!code ++]
         'vitepress' // [!code ++]

diff --git a/docs/pages/en/integrations/vitepress-plugin-git-changelog/configure-ui.md b/docs/pages/en/integrations/vitepress-plugin-git-changelog/configure-ui.md
@@ -405,11 +405,6 @@ import { defineConfig } from 'vite'
 export default defineConfig(() => {
   return {
     optimizeDeps: {
-      include: [
-        // @rive-app/canvas is a CJS/UMD module, so it needs to be included here
-        // for Vite to properly bundle it.
-        '@nolebase/vitepress-plugin-git-changelog > @nolebase/ui > @rive-app/canvas',
-      ],
       exclude: [
         '@nolebase/vitepress-plugin-git-changelog/client',
       ],

diff --git a/docs/pages/en/integrations/vitepress-plugin-inline-link-preview/configuration.md b/docs/pages/en/integrations/vitepress-plugin-inline-link-preview/configuration.md
@@ -322,6 +322,7 @@ export default defineConfig({
   markdown: {
     config(md) {
       // other markdown-it configurations...
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(InlineLinkPreviewElementTransform, { tag: 'YourComponentName' }) // [!code focus]
     }
   }

diff --git a/docs/pages/en/integrations/vitepress-plugin-inline-link-preview/getting-started.md b/docs/pages/en/integrations/vitepress-plugin-inline-link-preview/getting-started.md
@@ -57,6 +57,7 @@ export default defineConfig({
   markdown: { // [!code ++]
     config(md) { // [!code ++]
       // other markdown-it configurations... // [!code ++]
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(InlineLinkPreviewElementTransform) // [!code ++]
     } // [!code ++]
   } // [!code ++]

diff --git a/docs/pages/en/releases/migrations/v1-to-v2.md b/docs/pages/en/releases/migrations/v1-to-v2.md
@@ -71,6 +71,7 @@ export default defineConfig({
   markdown: {
     // ...
     config: (md) => {
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(InlineLinkPreviewElementTransform) // [!code ++]
     },
   },
@@ -119,6 +120,7 @@ export default defineConfig({
         } as ElementTransformOptions // [!code --]
       })()) // [!code --]
 
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(InlineLinkPreviewElementTransform) // [!code ++]
     },
   },
@@ -214,7 +216,7 @@ import '@nolebase/vitepress-plugin-highlight-targeted-heading/client/style.css'
 	1. `changelog.title`
 	2. `contributors.title`;
 6. In order to better structure the organization of the i18n fields, the original
-	1. `noLogs` i18n configuration changed to `changelog.noData`; 
+	1. `noLogs` i18n configuration changed to `changelog.noData`;
 	2. `noContributors` i18n configuration was changed to `contributors.noData`.
 	3. `lastEdited` i18n Configuration changed to `lastEdited`.
 	4. `lastEditedDateFnsLocaleName` configuration changed to `changelog.lastEditedDateFnsLocaleName`

diff --git a/docs/pages/en/ui/asciinema-player/index.md b/docs/pages/en/ui/asciinema-player/index.md
@@ -1,5 +1,5 @@
 <script setup>
-import { NuAsciinemaPlayer } from '@nolebase/ui'
+import { NuAsciinemaPlayer } from '@nolebase/ui-asciinema'
 </script>
 
 # Asciinema Player
@@ -17,24 +17,24 @@ import { NuAsciinemaPlayer } from '@nolebase/ui'
 
 ## Installation
 
-Install `@nolebase/ui` and `asciinema-player` to your project dependencies by running the following command:
+Install `@nolebase/ui-asciinema` to your project dependencies by running the following command:
 
 ::: code-group
 
 ```shell [@antfu/ni]
-ni @nolebase/ui asciinema-player
+ni @nolebase/ui-asciinema
 ```
 
 ```shell [pnpm]
-pnpm add @nolebase/ui asciinema-player
+pnpm add @nolebase/ui-asciinema
 ```
 
 ```shell [npm]
-npm install @nolebase/ui asciinema-player
+npm install @nolebase/ui-asciinema
 ```
 
 ```shell [yarn]
-yarn add @nolebase/ui asciinema-player
+yarn add @nolebase/ui-asciinema
 ```
 
 :::
@@ -43,7 +43,7 @@ yarn add @nolebase/ui asciinema-player
 
 ```vue
 <script setup>
-import { NuAsciinemaPlayer } from '@nolebase/ui'
+import { NuAsciinemaPlayer } from '@nolebase/ui-asciinema'
 import 'asciinema-player/dist/bundle/asciinema-player.css'
 </script>
 

diff --git a/docs/pages/en/ui/index.md b/docs/pages/en/ui/index.md
@@ -34,7 +34,7 @@ export default defineConfig(() => {
     optimizeDeps: { // [!code ++]
       include: [ // [!code ++]
         // Add this line to your vite.config.ts's optimizeDeps.include array // [!code ++]
-        '@nolebase/ui > @rive-app/canvas', // [!code ++]
+        '@nolebase/ui-rive-canvas > @rive-app/canvas', // [!code ++]
       ], // [!code ++]
     }, // [!code ++]
   }

diff --git a/docs/pages/en/ui/lazy-teleport-rive-canvas/index.md b/docs/pages/en/ui/lazy-teleport-rive-canvas/index.md
@@ -31,24 +31,24 @@ Rive Canvas is a very special component. Unlike regular components, regular comp
 
 ## Installation
 
-Install `@nolebase/ui` and `@rive-app/canvas` to your project dependencies by running the following command:
+Install `@nolebase/ui-rive-canvas` to your project dependencies by running the following command:
 
 ::: code-group
 
 ```shell [@antfu/ni]
-ni @nolebase/ui @rive-app/canvas
+ni @nolebase/ui-rive-canvas
 ```
 
 ```shell [pnpm]
-pnpm add @nolebase/ui @rive-app/canvas
+pnpm add @nolebase/ui-rive-canvas
 ```
 
 ```shell [npm]
-npm install @nolebase/ui @rive-app/canvas
+npm install @nolebase/ui-rive-canvas
 ```
 
 ```shell [yarn]
-yarn add @nolebase/ui @rive-app/canvas
+yarn add @nolebase/ui-rive-canvas
 ```
 
 :::
@@ -63,7 +63,7 @@ First, you need to import the `NuLazyTeleportRiveCanvas` component in the Vue co
 import type { App } from 'vue'
 let app = null as unknown as App
 // ---cut---
-import { NuLazyTeleportRiveCanvas } from '@nolebase/ui';
+import { NuLazyTeleportRiveCanvas } from '@nolebase/ui-rive-canvas';
 
 app.component('NuLazyTeleportRiveCanvas', NuLazyTeleportRiveCanvas);
 ```
@@ -80,7 +80,7 @@ export default defineConfig(() => {
     optimizeDeps: { // [!code ++]
       include: [ // [!code ++]
         // 添加这一行到你的 vite.config.ts 的 optimizeDeps.include 数组中 // [!code ++]
-        '@nolebase/ui  @rive-app/canvas', // [!code ++]
+        '@nolebase/ui-rive-canvas > @rive-app/canvas', // [!code ++]
       ], // [!code ++]
     }, // [!code ++]
   }
@@ -112,7 +112,7 @@ Then add the `<NuLazyTeleportRiveCanvas />` component in the entry file (`App.vu
 
 ```vue twoslash
 <script setup lang="ts">
-import { NuLazyTeleportRiveCanvas } from '@nolebase/ui' // [!code ++]
+import { NuLazyTeleportRiveCanvas } from '@nolebase/ui-rive-canvas' // [!code ++]
 </script>
 
 <template>
@@ -126,7 +126,7 @@ Or add `<NuLazyTeleportRiveCanvas />` component into `layout-top` slot you can s
 // .vitepress/theme/index.ts
 import { h } from 'vue'
 import DefaultTheme from 'vitepress/theme'
-import { NuLazyTeleportRiveCanvas } from '@nolebase/ui'
+import { NuLazyTeleportRiveCanvas } from '@nolebase/ui-rive-canvas'
 
 export default {
   extends: DefaultTheme,

diff --git a/docs/pages/zh-CN/integrations/markdown-it-bi-directional-links/getting-started.md b/docs/pages/zh-CN/integrations/markdown-it-bi-directional-links/getting-started.md
@@ -41,6 +41,7 @@ export default defineConfigWithTheme({
   },
   markdown: {
     config: (md) => {
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(BiDirectionalLinks()) // [!code ++]
     },
   },

diff --git a/docs/pages/zh-CN/integrations/vitepress-plugin-enhanced-readabilities/index.md b/docs/pages/zh-CN/integrations/vitepress-plugin-enhanced-readabilities/index.md
@@ -85,11 +85,6 @@ import { defineConfig } from 'vitepress'
 export default defineConfig({
   vite: { // [!code ++]
     optimizeDeps: {
-      include: [ // [!code ++]
-        // @rive-app/canvas is a CJS/UMD module, so it needs to be included here // [!code ++]
-        // for Vite to properly bundle it. // [!code ++]
-        '@nolebase/vitepress-plugin-enhanced-readabilities > @nolebase/ui > @rive-app/canvas', // [!code ++]
-      ], // [!code ++]
       exclude: [ // [!code ++]
         '@nolebase/vitepress-plugin-enhanced-readabilities/client', // [!code ++]
       ], // [!code ++]
@@ -122,11 +117,6 @@ import { defineConfig } from 'vite'
 export default defineConfig(() => {
   return {
     optimizeDeps: {
-      include: [ // [!code ++]
-        // @rive-app/canvas is a CJS/UMD module, so it needs to be included here // [!code ++]
-        // for Vite to properly bundle it. // [!code ++]
-        '@nolebase/vitepress-plugin-enhanced-readabilities > @nolebase/ui > @rive-app/canvas', // [!code ++]
-      ], // [!code ++]
       exclude: [ // [!code ++]
         '@nolebase/vitepress-plugin-enhanced-readabilities/client', // [!code ++]
         'vitepress' // [!code ++]

diff --git a/docs/pages/zh-CN/integrations/vitepress-plugin-git-changelog/configure-ui.md b/docs/pages/zh-CN/integrations/vitepress-plugin-git-changelog/configure-ui.md
@@ -401,11 +401,6 @@ import { defineConfig } from 'vite'
 export default defineConfig(() => {
   return {
     optimizeDeps: {
-      include: [
-        // @rive-app/canvas is a CJS/UMD module, so it needs to be included here
-        // for Vite to properly bundle it.
-        '@nolebase/vitepress-plugin-git-changelog > @nolebase/ui > @rive-app/canvas',
-      ],
       exclude: [
         '@nolebase/vitepress-plugin-git-changelog/client',
       ],

diff --git a/.../pages/zh-CN/integrations/vitepress-plugin-inline-link-preview/configuration.md b/.../pages/zh-CN/integrations/vitepress-plugin-inline-link-preview/configuration.md
@@ -317,6 +317,7 @@ export default defineConfig({
   markdown: {
     config(md) {
       // other markdown-it configurations...
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(InlineLinkPreviewElementTransform, { tag: 'YourComponentName' }) // [!code focus]
     }
   }

diff --git a/...ages/zh-CN/integrations/vitepress-plugin-inline-link-preview/getting-started.md b/...ages/zh-CN/integrations/vitepress-plugin-inline-link-preview/getting-started.md
@@ -57,6 +57,7 @@ export default defineConfig({
   markdown: { // [!code ++]
     config(md) { // [!code ++]
       // 其他 markdown-it 配置... // [!code ++]
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(InlineLinkPreviewElementTransform) // [!code ++]
     } // [!code ++]
   } // [!code ++]

diff --git a/docs/pages/zh-CN/releases/migrations/v1-to-v2.md b/docs/pages/zh-CN/releases/migrations/v1-to-v2.md
@@ -71,6 +71,7 @@ export default defineConfig({
   markdown: {
     // ...
     config: (md) => {
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(InlineLinkPreviewElementTransform) // [!code ++]
     },
   },
@@ -119,6 +120,7 @@ export default defineConfig({
         } as ElementTransformOptions // [!code --]
       })()) // [!code --]
 
+      // @ts-expect-error unmatched type for VitePress, ref https://github.com/nolebase/integrations/pull/228 [!code ++]
       md.use(InlineLinkPreviewElementTransform) // [!code ++]
     },
   },

diff --git a/docs/pages/zh-CN/ui/asciinema-player/index.md b/docs/pages/zh-CN/ui/asciinema-player/index.md
@@ -1,5 +1,5 @@
 <script setup>
-import { NuAsciinemaPlayer } from '@nolebase/ui'
+import { NuAsciinemaPlayer } from '@nolebase/ui-asciinema'
 </script>
 
 # Asciinema 播放器
@@ -17,24 +17,24 @@ import { NuAsciinemaPlayer } from '@nolebase/ui'
 
 ## 安装
 
-运行以下命令，将 `@nolebase/ui` 和 `asciinema-player` 安装到项目依赖项中：
+运行以下命令，将 `@nolebase/ui-asciinema` 安装到项目依赖项中：
 
 ::: code-group
 
 ```shell [@antfu/ni]
-ni @nolebase/ui asciinema-player
+ni @nolebase/ui-asciinema
 ```
 
 ```shell [pnpm]
-pnpm add @nolebase/ui asciinema-player
+pnpm add @nolebase/ui-asciinema
 ```
 
 ```shell [npm]
-npm install @nolebase/ui asciinema-player
+npm install @nolebase/ui-asciinema
 ```
 
 ```shell [yarn]
-yarn add @nolebase/ui asciinema-player
+yarn add @nolebase/ui-asciinema
 ```
 
 :::
@@ -43,7 +43,7 @@ yarn add @nolebase/ui asciinema-player
 
 ```vue
 <script setup>
-import { NuAsciinemaPlayer } from '@nolebase/ui'
+import { NuAsciinemaPlayer } from '@nolebase/ui-asciinema'
 import 'asciinema-player/dist/bundle/asciinema-player.css'
 </script>
 

diff --git a/docs/pages/zh-CN/ui/index.md b/docs/pages/zh-CN/ui/index.md
@@ -32,7 +32,7 @@ export default defineConfig(() => {
     optimizeDeps: { // [!code ++]
       include: [ // [!code ++]
         // 添加这一行到你的 vite.config.ts 的 optimizeDeps.include 数组中 // [!code ++]
-        '@nolebase/ui > @rive-app/canvas', // [!code ++]
+        '@nolebase/ui-rive-canvas > @rive-app/canvas', // [!code ++]
       ], // [!code ++]
     }, // [!code ++]
   }