feat: rewrite plugin system

Author: Wenjie Xia

framework/core/routing.ts

@@ -1,7 +1,6 @@
-import type { DependencyDescriptor } from '../../server/types.ts'
 import { reModuleExt } from '../../shared/constants.ts'
 import util from '../../shared/util.ts'
-import type { RouterURL } from '../../types.ts'
+import type { DependencyDescriptor, RouterURL } from '../../types.ts'
 import events from './events.ts'
 
 export interface Route {

framework/react/renderer.ts

@@ -3,27 +3,20 @@ import { createElement } from 'https://esm.sh/react'
 import { renderToString } from 'https://esm.sh/react-dom/server'
 import { hashShort, reHttp } from '../../shared/constants.ts'
 import util from '../../shared/util.ts'
-import type { RouterURL } from '../../types.ts'
+import type { RenderResult, RouterURL } from '../../types.ts'
 import events from '../core/events.ts'
 import { RendererContext, RouterContext } from './context.ts'
 import { AsyncUseDenoError, E400MissingComponent, E404Page } from './error.ts'
 import { serverStyles } from './style.ts'
 import { createPageProps, isLikelyReactComponent } from './util.ts'
 
-interface RenderResult {
-    head: string[]
-    body: string
-    data: Record<string, any> | null
-    scripts: Record<string, any>[]
-}
-
-export async function renderPage(
+export async function render(
     url: RouterURL,
     App: ComponentType<any> | undefined,
     E404: ComponentType | undefined,
     pageComponentTree: { url: string, Component?: any }[],
     styles?: { url: string, hash: string }[]
-): Promise<RenderResult> {
+) {
     let el: ReactElement
     const pageProps = createPageProps(pageComponentTree)
     if (App) {
@@ -48,7 +41,7 @@ export async function renderPage(
         }
     }
 
-    const ret: RenderResult = {
+    const ret: Omit<RenderResult, 'url' | 'status'> = {
         head: [],
         body: '',
         data: null,
@@ -58,7 +51,7 @@ export async function renderPage(
         headElements: new Map(),
         scriptsElements: new Map()
     }
-    const buildMode = Deno.env.get('__buildMode')
+    const buildMode = Deno.env.get('BUILD_MODE')
     const data: Record<string, any> = {}
     const useDenUrl = `useDeno://${url.pathname}`
     const useDenoAsyncCalls: Array<Promise<any>> = []
@@ -98,7 +91,6 @@ export async function renderPage(
             if (error instanceof AsyncUseDenoError) {
                 continue
             }
-            console.log(error)
             Object.assign(window, { [`__asyncData_${useDenUrl}`]: null })
             throw error
         }

plugins/sass.ts

@@ -3,10 +3,10 @@ import type { LoaderPlugin } from '../types.ts'
 
 const pluginFactory = (opts: Options = {}): LoaderPlugin => ({
     type: 'loader',
-    name: 'sass-loader',
+    loader: 'css',
     test: /.(sass|scss)$/,
     acceptHMR: true,
-    transform(content: Uint8Array, path: string) {
+    precompile(content: Uint8Array, path: string) {
         const ret = renderSync({
             indentedSyntax: path.endsWith('.sass'),
             ...opts,
@@ -17,16 +17,15 @@ const pluginFactory = (opts: Options = {}): LoaderPlugin => ({
         return {
             code: (new TextDecoder).decode(ret.css),
             map: ret.map ? (new TextDecoder).decode(ret.map) : undefined,
-            loader: 'css'
         }
     }
 })
-const defaultPlugin = pluginFactory()
 
-// make the `pluginFactory` as a plugin
-pluginFactory.type = defaultPlugin.type
+// make the `pluginFactory` function as a plugin
+const defaultPlugin = pluginFactory()
+pluginFactory.loader = defaultPlugin.loader
 pluginFactory.test = defaultPlugin.test
 pluginFactory.acceptHMR = defaultPlugin.acceptHMR
-pluginFactory.transform = defaultPlugin.transform
+pluginFactory.precompile = defaultPlugin.precompile
 
 export default pluginFactory

plugins/sass_test.ts

@@ -2,24 +2,24 @@ import { assertEquals } from 'https://deno.land/[email protected]/testing/asserts.ts'
 import plugin from './sass.ts'
 
 Deno.test('project scss loader plugin', async () => {
-    const { code, loader } = await plugin.transform(
+    const { code } = await plugin.precompile!(
         (new TextEncoder).encode('$someVar: 123px; .some-selector { width: $someVar; }'),
         'test.scss'
     )
     assertEquals(plugin.test.test('test.sass'), true)
     assertEquals(plugin.test.test('test.scss'), true)
+    assertEquals(plugin.loader, 'css')
     assertEquals(plugin.acceptHMR, true)
     assertEquals(code, '.some-selector {\n  width: 123px;\n}')
-    assertEquals(loader, 'css')
 })
 
 Deno.test('project sass loader plugin', async () => {
-    let ret = await plugin.transform(
+    let ret = await plugin.precompile!(
         (new TextEncoder).encode('$someVar: 123px\n.some-selector\n  width: 123px'),
         'test.sass'
     )
     assertEquals(ret.code, '.some-selector {\n  width: 123px;\n}')
-    ret = await plugin({ indentType: 'tab', indentWidth: 2 }).transform(
+    ret = await plugin({ indentType: 'tab', indentWidth: 2 }).precompile!(
         (new TextEncoder).encode('$someVar: 123px\n.some-selector\n  width: 123px'),
         'test.sass'
     )

plugins/wasm.ts

@@ -2,16 +2,15 @@ import type { LoaderPlugin } from '../types.ts'
 
 const wasmLoader: LoaderPlugin = {
     type: 'loader',
-    name: 'wasm-loader',
+    loader: 'js',
     test: /.wasm$/,
-    transform: (content: Uint8Array, path: string) => ({
+    precompile: (content: Uint8Array, path: string) => ({
         code: `
             const wasmBytes = new Uint8Array([${content.join(',')}])
             const wasmModule = new WebAssembly.Module(wasmBytes)
             const { exports } = new WebAssembly.Instance(wasmModule)
             export default exports
         `,
-        loader: 'js'
     })
 }
 

plugins/wasm_test.ts

@@ -10,11 +10,11 @@ Deno.test('project wasm loader plugin', async () => {
         105, 110, 0, 0, 10, 138, 128, 128, 128, 0, 1, 132, 128, 128, 128, 0, 0,
         65, 42, 11
     ])
-    const { code, loader } = await plugin.transform(wasmBytes, '42.wasm')
+    const { code } = await plugin.precompile!(wasmBytes, '42.wasm')
     const jsfile = (await Deno.makeTempFile()) + '.js'
     await Deno.writeTextFile(jsfile, code)
     const { default: wasm } = await import('file://' + jsfile)
     assertEquals(plugin.test.test('test.wasm'), true)
+    assertEquals(plugin.loader, 'js')
     assertEquals(wasm.main(), 42)
-    assertEquals(loader, 'js')
 })