fix(webui): fix import.meta.resolve error, support yarn pnp

plugins/insight/src/index.ts

@@ -54,10 +54,11 @@ export const Config: Schema<Config> = Schema.object({})
 
 export function apply(ctx: Context) {
   const entry = ctx.webui.addEntry({
-    dev: import.meta.resolve('../client/index.ts'),
+    base: import.meta.url,
+    dev: '../client/index.ts',
     prod: [
-      import.meta.resolve('../dist/index.js'),
-      import.meta.resolve('../dist/style.css'),
+      '../dist/index.js',
+      '../dist/style.css',
     ],
   }, getGraph)
 

plugins/manager/src/shared.ts

@@ -102,10 +102,11 @@ export abstract class Manager extends Service {
   start() {
     this.ctx.inject(['webui'], (ctx) => {
       this.entry = ctx.webui.addEntry({
-        dev: import.meta.resolve('../client/index.ts'),
+        base: import.meta.url,
+        dev: '../client/index.ts',
         prod: [
-          import.meta.resolve('../dist/index.js'),
-          import.meta.resolve('../dist/style.css'),
+          '../dist/index.js',
+          '../dist/style.css',
         ],
       }, () => (this.getPackages(), {
         entries: this.getEntries(),

plugins/notifier/src/index.ts

@@ -106,10 +106,11 @@ class NotifierService extends Service {
       ctx.on('dispose', () => this.entry = undefined)
 
       this.entry = ctx.webui.addEntry({
-        dev: import.meta.resolve('../client/index.ts'),
+        base: import.meta.url,
+        dev: '../client/index.ts',
         prod: [
-          import.meta.resolve('../dist/index.js'),
-          import.meta.resolve('../dist/style.css'),
+          '../dist/index.js',
+          '../dist/style.css',
         ],
       }, () => ({
         notifiers: this.store.map(notifier => notifier.toJSON()),

plugins/webui/src/browser.ts

@@ -15,8 +15,7 @@ class BrowserWebUI extends WebUI {
   }
 
   resolveEntry(files: Entry.Files) {
-    if (typeof files === 'string' || Array.isArray(files)) return makeArray(files)
-    return makeArray(files.prod)
+    return makeArray(files.prod).map(url => new URL(url, files.base).href)
   }
 }
 

plugins/webui/src/index.ts

@@ -5,7 +5,7 @@ import { FileSystemServeOptions, ViteDevServer } from 'vite'
 import { extname, resolve } from 'node:path'
 import { createReadStream, existsSync, Stats } from 'node:fs'
 import { readFile, stat } from 'node:fs/promises'
-import { fileURLToPath, pathToFileURL } from 'node:url'
+import { fileURLToPath } from 'node:url'
 import { parse } from 'es-module-lexer'
 import { Entry, Events, WebUI } from './shared'
 import open from 'open'
@@ -105,19 +105,20 @@ class NodeWebUI extends WebUI<NodeWebUI.Config> {
     })
   }
 
-  private getFiles(files: Entry.Files) {
-    if (typeof files === 'string' || Array.isArray(files)) return files
-    if (!this.config.devMode) return files.prod
-    if (!existsSync(fileURLToPath(files.dev))) return files.prod
-    return files.dev
+  private getPaths(files: Entry.Files) {
+    if (this.config.devMode && files.dev) {
+      const filename = fileURLToPath(new URL(files.dev, files.base))
+      if (existsSync(filename)) return [filename]
+    }
+    return makeArray(files.prod).map(url => fileURLToPath(new URL(url, files.base)))
   }
 
   resolveEntry(files: Entry.Files, key: string) {
-    return makeArray(this.getFiles(files)).map((url, index) => {
+    return this.getPaths(files).map((path, index) => {
       if (this.config.devMode) {
-        return `/vite/@fs/${fileURLToPath(url)}`
+        return `/vite/@fs/${path}`
       } else {
-        return `${this.config.uiPath}/@vendor/${key}/${index}${extname(url)}`
+        return `${this.config.uiPath}/@vendor/${key}/${index}${extname(path)}`
       }
     })
   }
@@ -143,11 +144,11 @@ class NodeWebUI extends WebUI<NodeWebUI.Config> {
       if (name.startsWith('@vendor/')) {
         const [key, value] = name.slice(8).split('/')
         if (!this.entries[key]) return ctx.status = 404
-        const files = makeArray(this.getFiles(this.entries[key].files))
+        const paths = this.getPaths(this.entries[key].files)
         const type = extname(value)
         const index = value.slice(0, -type.length)
-        if (!files[index]) return ctx.status = 404
-        const filename = fileURLToPath(files[index])
+        if (!paths[index]) return ctx.status = 404
+        const filename = paths[index]
         ctx.type = type
         if (this.config.devMode || ctx.type !== 'application/javascript') {
           return sendFile(filename)
@@ -222,7 +223,7 @@ class NodeWebUI extends WebUI<NodeWebUI.Config> {
         name: 'cordis-hmr',
         transform: (code, id, options) => {
           for (const [key, { files }] of Object.entries(this.entries)) {
-            const index = makeArray(this.getFiles(files)).indexOf(pathToFileURL(id).href)
+            const index = this.getPaths(files).indexOf(id)
             if (index < 0) continue
             code += [
               'if (import.meta.hot) {',

plugins/webui/src/shared/entry.ts

@@ -2,9 +2,8 @@ import { Context } from 'cordis'
 import { Client } from './index.ts'
 
 export namespace Entry {
-  export type Files = string | string[] | EntryOptions
-
-  export interface EntryOptions {
+  export interface Files {
+    base?: string
     dev: string
     prod: string | string[]
   }