@merkur/cli 0.36.4 → 0.37.0

package/src/plugins/aliasPlugin.mjs

@@ -0,0 +1,26 @@
+import { createLogger } from '../logger.mjs';
+
+import chalk from 'chalk';
+
+export function aliasPlugin({ definition, cliConfig }) {
+  const { projectFolder } = cliConfig;
+  const logger = createLogger('aliasPlugin', cliConfig);
+  return {
+    name: 'aliasPlugin',
+    setup(build) {
+      logger.debug(`Setup plugin for "${chalk.cyan(definition.name)}" task.`);
+
+      build.onResolve({ filter: /^@\// }, async (args) => {
+        const result = await build.resolve(args.path.replace(/^@\//, `./`), {
+          kind: 'import-statement',
+          resolveDir: `${projectFolder}/src/`,
+        });
+
+        if (result.errors.length > 0) {
+          return { errors: result.errors };
+        }
+        return { path: result.path };
+      });
+    },
+  };
+}

package/src/plugins/devPlugin.mjs

@@ -72,7 +72,14 @@ export function devPlugin({ definition, merkurConfig, cliConfig }) {
         });
 
         client.on('open', function open() {
-          if (merkurConfig.HMR) {
+          if (
+            merkurConfig.HMR &&
+            !(
+              cliConfig.writeToDisk &&
+              changed.length === 0 &&
+              errors.length === 0
+            )
+          ) {
             client.send(
               JSON.stringify({
                 to: 'browser',

package/src/plugins/excludeVendorsFromSourceMapPlugin.mjs

@@ -0,0 +1,19 @@
+import fs from 'node:fs/promises';
+
+export function excludeVendorsFromSourceMapPlugin() {
+  return {
+    name: 'excludeVendorsFromSourceMapPlugin',
+    setup(build) {
+      build.onLoad({ filter: /node_modules/ }, async (args) => {
+        const contents = await fs.readFile(args.path, { encoding: 'utf8' });
+
+        return {
+          contents:
+            contents +
+            '\n//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIiJdLCJtYXBwaW5ncyI6IkEifQ==',
+          loader: 'default',
+        };
+      });
+    },
+  };
+}

package/src/plugins/metaPlugin.mjs

@@ -1,4 +1,5 @@
 import fs from 'node:fs/promises';
+import path from 'node:path';
 
 import { createLogger } from '../logger.mjs';
 import { time } from '../utils.mjs';
@@ -31,7 +32,9 @@ export function metaPlugin({ definition, config, cliConfig }) {
 
           metaInformation = await Promise.all(
             generatedFiles.map(async (file) => {
-              const stat = await fs.stat(`${projectFolder}/${file}`);
+              const stat = await fs.stat(
+                path.resolve(`${projectFolder}/${file}`),
+              );
 
               return { stat, file };
             }),

package/src/runTask.mjs

@@ -1,6 +1,10 @@
+import fs from 'node:fs/promises';
+
 import esbuild from 'esbuild';
+import { createLogger } from './logger.mjs';
 
-export async function runTask({ cliConfig, build }) {
+export async function runTask({ cliConfig, build, config }) {
+  const logger = createLogger(undefined, cliConfig);
   const { watch } = cliConfig;
 
   //es6 === es2015, es9 === es2018, es11 === es2020 es13 ===es2022
@@ -9,6 +13,21 @@ export async function runTask({ cliConfig, build }) {
       ? esbuild.context(build)
       : esbuild.build(build));
 
+    if (config.analyze && result.metafile) {
+      logger.log(
+        await esbuild.analyzeMetafile(result.metafile, {
+          verbose: cliConfig.verbose,
+        }),
+      );
+
+      if (build.outdir) {
+        await fs.writeFile(
+          `${build.outdir}/${build.entryNames ?? config.name}.meta.json`,
+          JSON.stringify(result.metafile),
+        );
+      }
+    }
+
     if (watch) {
       await result.watch();
     }

package/src/taskConfig.mjs

@@ -9,6 +9,8 @@ export async function createTaskConfig({
     config: {
       isServer: definition?.build?.platform === 'node',
       writeToDisk: definition?.build?.write ?? cliConfig.writeToDisk,
+      sourcemap: definition?.build?.sourcemap ?? cliConfig.sourcemap,
+      analyze: definition?.build?.metafile ?? cliConfig.analyze,
       ...definition.config,
     },
     definition,

package/src/templates/body.ejs

@@ -1,18 +1,6 @@
 <% if(widgetProperties?.slot?.headline?.html){ %>
-  <div class="headline-view"><%- widgetProperties && widgetProperties.slot && widgetProperties.slot.headline &&
-      widgetProperties.slot.headline.html %></div>
+  <div class="<%= (widgetProperties?.slot?.headline?.containerSelector ?? 'merkur-headline').replace('.', '') %>">
+    <%- widgetProperties?.slot?.headline?.html %>
+  </div>
 <% } %>
-<div class="merkur-view"><%- html %></div>
-<script>
-  window.addEventListener('load', function () {
-    __merkur__.create(<%- escapeToJSON(widgetProperties) %>)
-      .then(function (widget) {
-        widget.containerSelector = '.merkur-view';
-        if (widget?.slot?.headline) {
-          widget.slot.headline.containerSelector = '.headline-view';
-        }
-
-        widget.mount();
-      });
-  });
-</script>
+<div class="<%= (widgetProperties?.containerSelector ?? 'merkur-main').replace('.', '') %>"><%- html %></div>

package/src/templates/footer.ejs

@@ -0,0 +1,25 @@
+<script>
+  window.addEventListener('load', function () {
+    __merkur__.create(<%- escapeToJSON(widgetProperties) %>)
+      .then(function (widget) {
+        widget.containerSelector = widget.containerSelector ?? '.merkur-main';
+
+        if (widget.slot && Object.keys(widget.slot).length > 0) {
+          Object.keys(widget.slot).forEach(function (slotName) {
+            widget.slot[slotName].containerSelector = widget.slot[slotName].containerSelector ?? '.merkur-' + slotName;
+          });
+        }
+
+        // support for router plugin
+        if (widget.router) {
+          widget.on('@merkur/plugin-router.redirect', function (_, url) {
+            var parsedUrl = new URL(url.url);
+            window.location = parsedUrl.href;
+          });
+        }
+
+        // mount widget to DOM
+        widget.mount();
+      });
+  });
+</script>

package/src/websocket.mjs

@@ -16,7 +16,6 @@ export async function runSocketServer({ merkurConfig, context }) {
   try {
     const server = new WebSocketServer({
       port: merkurConfig.socketServer.port,
-      host: merkurConfig.constant.HOST,
     });
 
     server.on('connection', function connection(ws) {

package/types.d.ts

@@ -1,5 +1,6 @@
 import type { BuildOptions } from 'esbuild';
 import type { Request, Response } from '@types/express';
+import type { CorsOptions } from '@types/cors';
 
 export interface CLIConfig {
   environment: string;
@@ -30,6 +31,7 @@ export type Extend =
 
 export interface Task {
   name: 'es13' | 'es9' | 'node' | string;
+  folder: 'es13' | 'es9' | string;
   build: BuildOptions;
   [key: string]: any;
 }
@@ -46,6 +48,7 @@ export interface DevServer {
 export interface Playground {
   template: string;
   templateFolder: string;
+  serverTemplateFolder: string;
   path: string;
   widgetHandler(req: Request, res: Response): Record<string, unknown>;
   widgetParams(req: Request): URLSearchParams;
@@ -66,6 +69,9 @@ export interface WidgetServer {
   staticPath: string;
   buildFolder: string;
   clusters: number;
+  cors: {
+    options: CorsOptions;
+  };
 }
 
 export interface Constant {