@cmmn/tools 1.9.3 → 1.9.4

package/bundle/esbuild.config.js

@@ -54,6 +54,13 @@ export class ConfigCreator {
         return path.join(this.root, this.options.outDir);
     }
 
+    get importMaps(){
+        return JSON.stringify({
+            imports: Object.fromEntries(this.options.external
+                .map(key => key.replace('*', '/'))
+                .map(key => [key, `/external/${this.options.alias?.[key] ?? key}`]))
+        })
+    }
     getHtmlPlugin(){
         if (!this.options.html)
             return [];
@@ -61,21 +68,26 @@ export class ConfigCreator {
             {
                 name: 'esbuild-html-plugin',
                 setup: (build) => { build.onEnd(async result => {
-                    const inject = [
+                    if (!result.metafile)
+                        return;
+                    const injectStyles = [];
+                    const injectScripts = [
                         `<script type="importmap">${this.importMaps}</script>`
                     ];
                     for (let [key, value] of Object.entries(result.metafile.outputs)){
                         if (value.entryPoint !== this.options.input) continue;
                         const file = path.relative(this.outDir, path.join(this.root, key));
-                        inject.push(`<script type="module" src="/${file}"/>`)
+                        injectScripts.push(`<script type="module" src="/${file}"></script>`)
                         if (value.cssBundle) {
                             const file = path.relative(this.outDir, path.join(this.root, value.cssBundle));
-                            inject.push(`<style rel="stylesheet" href="/${file}"/>`)
+                            injectStyles.push(`<link rel="stylesheet" href="/${file}"></link>`)
                         }
                         const html = await fs.promises.readFile(path.join(this.root, this.options.html));
                         await fs.promises.writeFile(
                             path.join(this.outDir, 'index.html'),
-                            html.toString().replace('</head>', `${inject.map(x => `\t${x}\n`).join('')}</head>`)
+                            html.toString()
+                                .replace('</head>', `${injectStyles.map(x => `\t${x}\n`).join('')}</head>`)
+                                .replace('</body>', `${injectScripts.map(x => `\t${x}\n`).join('')}</body>`)
                         );
                     }
                 }); }
@@ -112,7 +124,7 @@ export class ConfigCreator {
             ],
             bundle: true,
             minify: this.options.minify,
-            sourcemap: true,
+            sourcemap: this.options.minify ? false : 'external',
             target: ['chrome88', 'safari14', 'firefox88'],
             outdir: 'dist/bundle',
             metafile: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cmmn/tools",
-  "version": "1.9.3",
+  "version": "1.9.4",
   "description": "Compilation, bundling, code generator, testing.",
   "main": "dist/rollup.config.js",
   "type": "module",
@@ -62,5 +62,5 @@
   },
   "author": "",
   "license": "ISC",
-  "gitHead": "5b83506f4132e1876b5573f7245d8bc759fcb92d"
+  "gitHead": "1602adb5285c0b8a7bd52d5a5d32860cdad4a434"
 }

package/serve/serve.js

@@ -17,10 +17,11 @@ export function serve(...options) {
             file: 'index.html',
             port: process.env.PORT ? (+process.env.PORT + i) : x.port,
             open: false,
+            watch: configs.map(x => path.join(x.rootDir, x.outDir ?? 'dist/bundle')).join(','),
             mount: x.mount && Object.entries(x.mount)
-                .map(([from, to]) => [from, path.resolve(x.rootDir, to)])
-                .concat(configs.map(x => [`/external/${x.package}`,
-                    path.join(x.rootDir, x.outDir ?? `dist/bundle/${x.name}.js`)])),
+                .map(([from, to]) => [from, path.resolve(x.rootDir, to)]),
+                // .concat(configs.map(x => [`/external/${x.package}`,
+                //     path.join(x.rootDir, x.outDir ?? `dist/bundle/${x.name}.js`)])),
             proxy: Object.entries(x.proxy ?? {}),
             middleware: [resolveESModule(x.rootDir, configs)].filter(x => x)
         });
@@ -36,6 +37,16 @@ function getModuleName(path) {
 
 const mappingCache = {};
 
+async function resolveModule(module, root){
+    const conditions = ['browser', 'main', 'module', 'import', 'node', 'default'];
+    for (let condition of conditions) {
+        try {
+            return moduleResolve(module, root, new Set([condition]));
+        }catch (e){
+        }
+    }
+    throw new Error(`Failed resolve ${module} from ${root}`);
+}
 // for resolve modules and files inside modules
 async function getFileName(moduleName, root) {
     // console.log(moduleName, root);
@@ -44,21 +55,22 @@ async function getFileName(moduleName, root) {
     let file;
     if (moduleName.match('\.[cm]?js')) {
         const module = moduleName.match(/^(@[^/]+\/)?[^/]+/)[0];
-        const main = (await moduleResolve(module, root, new Set(['module', 'import', 'browser', 'main', 'node'])));
+        const main = await resolveModule(module, root);
         const file = main.href.replace(new RegExp('node_modules/' + module + '.*$'), 'node_modules/' + moduleName);
-        console.log(file)
         return mappingCache[moduleName] = file;
     } else {
-        const file = (await moduleResolve(moduleName, root, new Set(['module', 'import', 'browser', 'main', 'node'])));
+        const file = await resolveModule(moduleName, root);
         return mappingCache[moduleName] = file.href;
     }
 }
 const resolveESModule = (rootDir, configs) => async function (req, res, next) {
     const name = getModuleName(req.url);
-    if (!name)
-        return next();
-    if (configs.some(x => x.package === name))
+    if (!name) {
+        console.log(`skip ${req.url}`)
         return next();
+    }
+    // if (configs.some(x => x.package === name))
+    //     return next();
     const referer = req.headers.referer?.substring(req.headers.origin.length);
     const refererModule = referer && getModuleName(referer);
     const root = refererModule
@@ -67,7 +79,7 @@ const resolveESModule = (rootDir, configs) => async function (req, res, next) {
     try {
         const file = uri2path(await getFileName(name, root));
         var stat = fs.statSync(file);
-
+        console.info(`Resolve ${name} to ${file}`)
         res.writeHead(200, {
             'Content-Type': 'application/javascript',
             'Content-Length': stat.size