refactor: cleanup

Author: Je

mime.ts

@@ -1,4 +1,4 @@
-// mime types for web
+// MIME Types for Web
 const mimeTypes: Record<string, string[]> = {
     // application
     'application/javascript': ['js', 'mjs'],
@@ -9,16 +9,16 @@ const mimeTypes: Record<string, string[]> = {
     'application/xml': ['xml', 'xsl'],
     // text
     'text/html': ['html', 'htm'],
-    'text/markdown': ['markdown', 'md'],
+    'text/markdown': ['md', 'markdown'],
+    'text/mdx': ['mdx'],
     'text/typescript': ['ts', 'tsx'],
     'text/jsx': ['jsx'],
-    'text/mdx': ['mdx'],
     'text/css': ['css'],
     'text/less': ['less'],
     'text/sass': ['sass', 'scss'],
     'text/stylus': ['stylus', 'styl'],
     'text/csv': ['csv'],
-    'text/plain': ['txt', 'text', 'conf', 'ini', 'log'],
+    'text/plain': ['txt', 'text', 'conf', 'ini', 'log', 'yaml'],
     // font
     'font/ttf': ['ttf'],
     'font/otf': ['otf'],
@@ -44,13 +44,14 @@ const mimeTypes: Record<string, string[]> = {
     'video/ogg': ['ogv'],
     'video/webm': ['webm'],
 }
-
+const defaultType = 'application/octet-stream'
 const typesMap = Object.keys(mimeTypes).reduce((map, contentType) => {
     mimeTypes[contentType].forEach(ext => map.set(ext, contentType))
     return map
 }, new Map<string, string>())
 
-export function getContentType(filepath: string): string {
-    const ext = filepath.split('.').pop()!.toLowerCase()
-    return typesMap.get(ext) ?? 'application/octet-stream'
+/** get content type by file name */
+export function getContentType(filename: string): string {
+    const ext = filename.split('.').pop()!.toLowerCase()
+    return typesMap.get(ext) ?? defaultType
 }

project.ts

@@ -536,17 +536,17 @@ export class Project {
         Object.assign(this, { buildID: this.mode + '.' + this.config.buildTarget })
         // update routing
         this.#routing = new Routing([], this.config.baseUrl, this.config.defaultLocale, this.config.locales)
-        // import postcss plugins
-        await Promise.all(this.config.postcss.plugins.map(async p => {
-            let name: string
-            if (typeof p === 'string') {
-                name = p
-            } else {
-                name = p.name
+        // inject ALEPH global variable
+        Object.assign(globalThis, {
+            ALEPH: {
+                ENV: {
+                    ...this.config.env,
+                    __version: version,
+                    __buildMode: this.mode,
+                    __buildTarget: this.config.buildTarget,
+                } as AlephEnv
             }
-            const { default: Plugin } = await import(`https://esm.sh/${name}[email protected]&no-check`)
-            this.#postcssPlugins[name] = Plugin
-        }))
+        })
     }
 
     private async _init(reload: boolean) {
@@ -565,24 +565,21 @@ export class Project {
             await ensureDir(this.buildDir)
         }
 
-        Object.assign(globalThis, {
-            ALEPH: {
-                ENV: {
-                    ...this.config.env,
-                    __version: version,
-                    __buildMode: this.mode,
-                    __buildTarget: this.config.buildTarget,
-                } as AlephEnv
-            },
-            document: new Document(),
-            innerWidth: 1920,
-            innerHeight: 1080,
-            devicePixelRatio: 1,
-            $RefreshReg$: () => { },
-            $RefreshSig$: () => (type: any) => type,
-        })
+        // change current work dir to appDoot
         Deno.chdir(this.appRoot)
 
+        // import postcss plugins
+        await Promise.all(this.config.postcss.plugins.map(async p => {
+            let name: string
+            if (typeof p === 'string') {
+                name = p
+            } else {
+                name = p.name
+            }
+            const { default: Plugin } = await import(`https://esm.sh/${name}[email protected]&no-check`)
+            this.#postcssPlugins[name] = Plugin
+        }))
+
         for await (const { path: p, } of walk(this.srcDir, { ...walkOptions, maxDepth: 1, exts: [...walkOptions.exts, '.jsx', '.tsx'] })) {
             const name = path.basename(p)
             switch (name.replace(reModuleExt, '')) {
@@ -627,7 +624,7 @@ export class Project {
         log.info(colors.bold(`Aleph.js v${version}`))
         if (this.config.__file) {
             log.info(colors.bold('- Config'))
-            log.info('  ⚙️', this.config.__file)
+            log.info('  ▲', this.config.__file)
         }
         log.info(colors.bold('- Global'))
         if (this.#modules.has('/app.js')) {
@@ -970,7 +967,7 @@ export class Project {
             let sourceCode = (new TextDecoder).decode(sourceContent)
             for (const plugin of this.config.plugins) {
                 if (plugin.test.test(url) && plugin.transform) {
-                    const { code, loader = 'js' } = await plugin.transform(sourceContent)
+                    const { code, loader = 'js' } = await plugin.transform(sourceContent, url)
                     sourceCode = code
                     mod.loader = loader
                     break
@@ -1418,6 +1415,16 @@ export class Project {
     }
 }
 
+// add virtual browser global objects
+Object.assign(globalThis, {
+    document: new Document(),
+    innerWidth: 1920,
+    innerHeight: 1080,
+    devicePixelRatio: 1,
+    $RefreshReg$: () => { },
+    $RefreshSig$: () => (type: any) => type,
+})
+
 /** inject HMR and React Fast Referesh helper code  */
 export function injectHmr({ id, sourceFilePath, jsContent }: Module): string {
     let hmrImportPath = path.relative(

types.ts

@@ -13,6 +13,20 @@ export interface AlephEnv {
     readonly __buildTarget: string
 }
 
+/**
+ * A plugin for **Aleph.js** application.
+ */
+export interface Plugin {
+    /** `name` gives the plugin a name. */
+    name?: string
+    /** `test` matches the import url. */
+    test: RegExp
+    /** `resolve` resolves the import url, if the `external` returned the compilation will skip the import url. */
+    resolve?(url: string): { url: string, external?: boolean }
+    /** `transform` transforms the source content. */
+    transform?(content: Uint8Array, url: string): Promise<{ code: string, sourceMap?: string, loader?: 'js' | 'jsx' | 'css' | 'markdown' }>
+}
+
 /**
  * The options for **SSR**.
  */
@@ -27,20 +41,6 @@ export interface SSROptions {
     staticPaths?: string[]
 }
 
-/**
- * A plugin for **Aleph.js** application.
- */
-export interface Plugin {
-    /** `name` gives the plugin a name. */
-    name?: string
-    /** `test` matches import url to transform */
-    test: RegExp
-    /** `resolve` resolves the import url, if the `external` returned the compilation will skip the import url. */
-    resolve?(url: string): { url: string, external?: boolean }
-    /** `transform` transforms the source content. */
-    transform?(content: Uint8Array): Promise<{ code: string, sourceMap?: string, loader?: 'js' | 'jsx' | 'css' | 'markdown' }>
-}
-
 /**
  * Config for Aleph.js application.
  */