feat: use esm.sh

Author: Je

cli.ts

@@ -93,30 +93,9 @@ function main() {
             if (match) {
                 const port = parseInt(match[2])
                 listenAndServe({ port }, async (req: ServerRequest) => {
-                    const url = new URL('http://localhost' + req.url)
-
-                    if (/^\/react(\-dom)?$/.test(url.pathname)) {
-                        const vendorName = path.basename(url.pathname)
-                        const env = url.searchParams.get('env') === 'development' ? 'development' : 'production'
-                        req.respond({
-                            status: 200,
-                            headers: new Headers({
-                                'Content-Type': 'application/javascript',
-                                'X-TypeScript-Types': `/${vendorName}/types/index.d.ts`
-                            }),
-                            body: [
-                                `export * from '/${vendorName}/${vendorName}.${env}.js';`,
-                                `export { default } from '/${vendorName}/${vendorName}.${env}.js';`
-                            ].join('\n')
-                        })
-                        return
-                    }
-
                     try {
+                        const url = new URL('http://localhost' + req.url)
                         let filepath = path.join(Deno.cwd(), url.pathname)
-                        if (/^\/react(\-dom)?\//.test(url.pathname)) {
-                            filepath = path.join(Deno.cwd(), 'vendor', url.pathname)
-                        }
                         const info = await Deno.lstat(filepath)
                         if (info.isDirectory) {
                             const r = Deno.readDir(filepath)
@@ -139,7 +118,6 @@ function main() {
                             })
                             return
                         }
-
                         req.respond({
                             status: 200,
                             headers: new Headers({ 'Content-Type': getContentType(filepath) }),

deps.ts

@@ -1,3 +1,6 @@
+
+export { minify } from 'http://localhost/[[email protected],[email protected]]/terser'
+export { default as ts } from 'http://localhost/[[email protected],[email protected]]/typescript'
 export { Tar, Untar } from 'https://deno.land/[email protected]/archive/tar.ts'
 export * as colors from 'https://deno.land/[email protected]/fmt/colors.ts'
 export { ensureDir } from 'https://deno.land/[email protected]/fs/ensure_dir.ts'
@@ -11,7 +14,4 @@ export * as ws from 'https://deno.land/[email protected]/ws/mod.ts'
 export { gzipDecode, gzipEncode } from 'https://deno.land/x/[email protected]/mod.ts'
 export { default as AnsiUp } from './vendor/ansi-up/ansi-up.ts'
 export { default as less } from './vendor/less/less.js'
-export { minify } from './vendor/terser/terser.js'
-// @deno-types="./vendor/typescript/lib/typescript.d.ts"
-export { default as ts } from './vendor/typescript/lib/typescript.js'
 import './vendor/clean-css-builds/v4.2.2.js'

examples/hello-world/import_map.json

@@ -0,0 +1,5 @@
+{
+    "imports": {
+        "https://esm.sh/": "https://esm.sh/[react,react-dom]/"
+    }
+}

hmr.ts

@@ -1,6 +1,6 @@
+import runtime from 'https://esm.sh/react-refresh/runtime?dev'
 import events from './events.ts'
 import util, { hashShort } from './util.ts'
-import runtime from './vendor/react-refresh/runtime.js'
 
 interface Callback {
     (...args: any[]): void

import_map.json

@@ -1,6 +1,5 @@
 {
     "imports": {
-        "https://esm.sh/": "http://localhost:9006/",
         "https://deno.land/x/aleph/": "http://localhost:9006/"
     }
 }

project.ts

@@ -712,8 +712,24 @@ export default class Project {
                     break
                 }
             }
+            if (dlUrl.startsWith('https://esm.sh/[')) {
+                dlUrl.replace(/\[([^\]]+)\]/, (_, s: string) => {
+                    const list = s.split(',').map(s => s.trim())
+                    if (list.length > 0) {
+                        const mod = util.trimPrefix(url, 'https://esm.sh/').replace(/\/+$/, '')
+                        if (!list.includes(mod)) {
+                            dlUrl = url
+                        }
+                    }
+                    return _
+                })
+            }
             if (this.isDev && url.startsWith('https://esm.sh/')) {
-                dlUrl += '?env=development'
+                const u = new URL(dlUrl)
+                if (!u.searchParams.has('dev')) {
+                    u.searchParams.set('env', 'development')
+                }
+                dlUrl = u.toString()
             }
             if (mod.sourceHash === '') {
                 log.info('Download', url, dlUrl != url ? colors.dim(`• ${dlUrl}`) : '')
@@ -821,7 +837,7 @@ export default class Project {
                     reactRefresh: this.isDev && !mod.isRemote && (mod.id === './404.js' || mod.id === './app.js' || mod.id.startsWith('./pages/') || mod.id.startsWith('./components/')),
                     rewriteImportPath: (path: string) => this._rewriteImportPath(mod, path),
                 }
-                const { diagnostics, outputText, sourceMapText } = compile(mod.url, sourceContent, compileOptions)
+                const { diagnostics, outputText, sourceMapText } = compile(mod.sourceFilePath, sourceContent, compileOptions)
                 if (diagnostics && diagnostics.length > 0) {
                     throw new Error(`compile ${url}: ${diagnostics.map(d => d.messageText).join(' ')}`)
                 }
@@ -840,8 +856,14 @@ export default class Project {
                             content: sourceMapText!,
                         }
                     })
-                    mod.jsContent = code
-                    mod.jsSourceMap = map
+                    if (code) {
+                        mod.jsContent = code
+                    } else {
+                        mod.jsContent = jsContent
+                    }
+                    if (util.isNEString(map)) {
+                        mod.jsSourceMap = map
+                    }
                 }
                 mod.hash = (new Sha1).update(mod.jsContent).hex()
             }
@@ -1057,7 +1079,7 @@ function renameImportUrl(importUrl: string): string {
     const ext = path.extname(path.basename(url.pathname)) || '.js'
     let pathname = util.trimSuffix(url.pathname, ext)
     if (url.search) {
-        pathname += '/' + btoa(url.search).replace(/[\.\/=]/g, '')
+        pathname += '@' + btoa(url.search).replace(/\//g, '_').replace(/=/g, '')
     }
     if (isRemote) {
         return '/-/' + url.hostname + (url.port ? '/' + url.port : '') + pathname + ext