feat: create workspace from loading existing exported file (#2122)

Co-authored-by: Himself65 <himself65@outlook.com>

apps/electron/scripts/build-ci.mts

@@ -1,17 +0,0 @@
-#!/usr/bin/env ts-node-esm
-import * as esbuild from 'esbuild';
-
-import { config } from './common.mjs';
-
-const common = config();
-await esbuild.build(common.preload);
-
-await esbuild.build({
-  ...common.main,
-  define: {
-    ...common.main.define,
-    'process.env.NODE_ENV': `"production"`,
-  },
-});
-
-console.log('Compiled successfully.');

apps/electron/scripts/build-layers.mjs

@@ -0,0 +1,28 @@
+#!/usr/bin/env zx
+import 'zx/globals';
+
+import * as esbuild from 'esbuild';
+
+import { config } from './common.mjs';
+
+const NODE_ENV =
+  process.env.NODE_ENV === 'development' ? 'development' : 'production';
+
+async function buildLayers() {
+  const common = config();
+  await esbuild.build(common.preload);
+
+  await esbuild.build({
+    ...common.main,
+    define: {
+      ...common.main.define,
+      'process.env.NODE_ENV': `"${NODE_ENV}"`,
+      'process.env.BUILD_TYPE': `"${process.env.BUILD_TYPE || 'stable'}"`,
+    },
+  });
+
+  await $`yarn workspace @affine/electron generate-main-exposed-meta`;
+}
+
+await buildLayers();
+echo('Build layers done');

apps/electron/scripts/common.mjs

@@ -5,6 +5,13 @@ import { fileURLToPath } from 'url';
 export const root = fileURLToPath(new URL('..', import.meta.url));
 export const NODE_MAJOR_VERSION = 18;
 
+// hard-coded for now:
+// fixme(xp): report error if app is not running on DEV_SERVER_URL
+const DEV_SERVER_URL = process.env.DEV_SERVER_URL;
+
+/** @type 'production' | 'development'' */
+const mode = (process.env.NODE_ENV = process.env.NODE_ENV || 'development');
+
 const nativeNodeModulesPlugin = {
   name: 'native-node-modules',
   setup(build) {
@@ -20,22 +27,32 @@ const ENV_MACROS = ['AFFINE_GOOGLE_CLIENT_ID', 'AFFINE_GOOGLE_CLIENT_SECRET'];
 
 /** @return {{main: import('esbuild').BuildOptions, preload: import('esbuild').BuildOptions}} */
 export const config = () => {
-  const define = Object.fromEntries(
-    ENV_MACROS.map(key => [
+  const define = Object.fromEntries([
+    ...ENV_MACROS.map(key => [
       'process.env.' + key,
       JSON.stringify(process.env[key] ?? ''),
-    ])
-  );
+    ]),
+    ['process.env.NODE_ENV', `"${mode}"`],
+  ]);
+
+  if (DEV_SERVER_URL) {
+    define['process.env.DEV_SERVER_URL'] = `"${DEV_SERVER_URL}"`;
+  }
+
   return {
     main: {
-      entryPoints: [resolve(root, './layers/main/src/index.ts')],
+      entryPoints: [
+        resolve(root, './layers/main/src/index.ts'),
+        resolve(root, './layers/main/src/exposed.ts'),
+      ],
       outdir: resolve(root, './dist/layers/main'),
       bundle: true,
       target: `node${NODE_MAJOR_VERSION}`,
       platform: 'node',
-      external: ['electron', 'yjs', 'better-sqlite3'],
+      external: ['electron', 'yjs', 'better-sqlite3', 'electron-updater'],
       plugins: [nativeNodeModulesPlugin],
       define: define,
+      format: 'cjs',
     },
     preload: {
       entryPoints: [resolve(root, './layers/preload/src/index.ts')],
@@ -43,7 +60,8 @@ export const config = () => {
       bundle: true,
       target: `node${NODE_MAJOR_VERSION}`,
       platform: 'node',
-      external: ['electron'],
+      external: ['electron', '../main/exposed-meta'],
+      plugins: [nativeNodeModulesPlugin],
       define: define,
     },
   };

apps/electron/scripts/dev.mjs

@@ -1,4 +1,5 @@
-import { spawn } from 'node:child_process';
+/* eslint-disable no-async-promise-executor */
+import { execSync, spawn } from 'node:child_process';
 import { readFileSync } from 'node:fs';
 import path from 'node:path';
 
@@ -7,8 +8,8 @@ import * as esbuild from 'esbuild';
 
 import { config, root } from './common.mjs';
 
-/** @type 'production' | 'development'' */
-const mode = (process.env.NODE_ENV = process.env.NODE_ENV || 'development');
+// this means we don't spawn electron windows, mainly for testing
+const watchMode = process.argv.includes('--watch');
 
 /** Messages on stderr that match any of the contained patterns will be stripped from output */
 const stderrFilterPatterns = [
@@ -29,14 +30,13 @@ try {
   );
 }
 
-// hard-coded for now:
-// fixme(xp): report error if app is not running on DEV_SERVER_URL
-const DEV_SERVER_URL = process.env.DEV_SERVER_URL;
-
 /** @type {ChildProcessWithoutNullStreams | null} */
 let spawnProcess = null;
 
 function spawnOrReloadElectron() {
+  if (watchMode) {
+    return;
+  }
   if (spawnProcess !== null) {
     spawnProcess.off('exit', process.exit);
     spawnProcess.kill('SIGINT');
@@ -59,77 +59,80 @@ function spawnOrReloadElectron() {
     console.error(data);
   });
 
-  // Stops the watch script when the application has been quit
+  // Stops the watch script when the application has quit
   spawnProcess.on('exit', process.exit);
 }
 
 const common = config();
 
-async function main() {
-  async function watchPreload(onInitialBuild) {
+function watchPreload() {
+  return new Promise(async resolve => {
+    let initialBuild = false;
     const preloadBuild = await esbuild.context({
       ...common.preload,
       plugins: [
         ...(common.preload.plugins ?? []),
         {
-          name: 'affine-dev:reload-app-on-preload-change',
+          name: 'electron-dev:reload-app-on-preload-change',
           setup(build) {
-            let initialBuild = false;
             build.onEnd(() => {
               if (initialBuild) {
-                console.log(`[preload] has changed`);
+                console.log(`[preload] has changed, [re]launching electron...`);
                 spawnOrReloadElectron();
               } else {
+                resolve();
                 initialBuild = true;
-                onInitialBuild();
               }
             });
           },
         },
       ],
     });
+    // watch will trigger build.onEnd() on first run & on subsequent changes
     await preloadBuild.watch();
-  }
+  });
+}
 
-  async function watchMain() {
-    const define = {
-      ...common.main.define,
-      'process.env.NODE_ENV': `"${mode}"`,
-    };
-
-    if (DEV_SERVER_URL) {
-      define['process.env.DEV_SERVER_URL'] = `"${DEV_SERVER_URL}"`;
-    }
+async function watchMain() {
+  return new Promise(async resolve => {
+    let initialBuild = false;
 
     const mainBuild = await esbuild.context({
       ...common.main,
-      define: define,
       plugins: [
         ...(common.main.plugins ?? []),
         {
-          name: 'affine-dev:reload-app-on-main-change',
+          name: 'electron-dev:reload-app-on-main-change',
           setup(build) {
-            let initialBuild = false;
             build.onEnd(() => {
+              execSync('yarn generate-main-exposed-meta');
+
               if (initialBuild) {
                 console.log(`[main] has changed, [re]launching electron...`);
+                spawnOrReloadElectron();
               } else {
+                resolve();
                 initialBuild = true;
               }
-              spawnOrReloadElectron();
             });
           },
         },
       ],
     });
     await mainBuild.watch();
-  }
-
-  await watchPreload(async () => {
-    await watchMain();
-    spawnOrReloadElectron();
-    console.log(`Electron is started, watching for changes...`);
   });
 }
 
+async function main() {
+  await watchMain();
+  await watchPreload();
+
+  if (watchMode) {
+    console.log(`Watching for changes...`);
+  } else {
+    spawnOrReloadElectron();
+    console.log(`Electron is started, watching for changes...`);
+  }
+}
+
 main();

apps/electron/scripts/generate-assets.mjs

@@ -3,10 +3,6 @@ import 'zx/globals';
 
 import path from 'node:path';
 
-import * as esbuild from 'esbuild';
-
-import { config } from './common.mjs';
-
 const repoRootDir = path.join(__dirname, '..', '..', '..');
 const electronRootDir = path.join(__dirname, '..');
 const publicDistDir = path.join(electronRootDir, 'resources');
@@ -37,8 +33,7 @@ if (process.platform === 'win32') {
 cd(repoRootDir);
 
 // step 1: build electron resources
-await buildLayers();
-echo('Build layers done');
+await $`yarn workspace @affine/electron build-layers`;
 
 // step 2: build web (nextjs) dist
 if (!process.env.SKIP_WEB_BUILD) {
@@ -75,17 +70,3 @@ async function cleanup() {
   await fs.emptyDir(path.join(electronRootDir, 'layers', 'preload', 'dist'));
   await fs.remove(path.join(electronRootDir, 'out'));
 }
-
-async function buildLayers() {
-  const common = config();
-  await esbuild.build(common.preload);
-
-  await esbuild.build({
-    ...common.main,
-    define: {
-      ...common.main.define,
-      'process.env.NODE_ENV': `"production"`,
-      'process.env.BUILD_TYPE': `"${process.env.BUILD_TYPE || 'statble'}"`,
-    },
-  });
-}

apps/electron/scripts/generate-main-exposed-meta.mjs

@@ -0,0 +1,40 @@
+#!/usr/bin/env zx
+/* eslint-disable @typescript-eslint/no-restricted-imports */
+import 'zx/globals';
+
+const mainDistDir = path.resolve(__dirname, '../dist/layers/main');
+
+// be careful and avoid any side effects in
+const { handlers, events } = await import(
+  path.resolve(mainDistDir, 'exposed.js')
+);
+
+const handlersMeta = Object.entries(handlers).map(
+  ([namespace, namespaceHandlers]) => {
+    return [
+      namespace,
+      Object.keys(namespaceHandlers).map(handlerName => handlerName),
+    ];
+  }
+);
+
+const eventsMeta = Object.entries(events).map(
+  ([namespace, namespaceHandlers]) => {
+    return [
+      namespace,
+      Object.keys(namespaceHandlers).map(handlerName => handlerName),
+    ];
+  }
+);
+
+const meta = {
+  handlers: handlersMeta,
+  events: eventsMeta,
+};
+
+await fs.writeFile(
+  path.resolve(mainDistDir, 'exposed-meta.js'),
+  `module.exports = ${JSON.stringify(meta)};`
+);
+
+console.log('generate main exposed-meta.js done');