feat: add local blocksuite debug support (#3591)

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

apps/core/.webpack/config.ts

@@ -73,6 +73,8 @@ export const createConfiguration: (
 ) => webpack.Configuration = (buildFlags, runtimeConfig) => {
   let publicPath = process.env.PUBLIC_PATH ?? '/';
 
+  const blocksuiteBaseDir = buildFlags.localBlockSuite;
+
   const cacheKey = computeCacheKey(buildFlags);
 
   const config = {
@@ -121,6 +123,66 @@ export const createConfiguration: (
         '.mjs': ['.mjs', '.mts'],
       },
       extensions: ['.js', '.ts', '.tsx'],
+      fallback:
+        blocksuiteBaseDir === undefined
+          ? undefined
+          : {
+              events: false,
+            },
+      alias:
+        blocksuiteBaseDir === undefined
+          ? undefined
+          : {
+              yjs: require.resolve('yjs'),
+              '@blocksuite/block-std': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'block-std'
+              ),
+              '@blocksuite/blocks': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'blocks'
+              ),
+              '@blocksuite/editor': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'editor'
+              ),
+              '@blocksuite/global': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'global'
+              ),
+              '@blocksuite/lit': resolve(blocksuiteBaseDir, 'packages', 'lit'),
+              '@blocksuite/phasor': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'phasor'
+              ),
+              '@blocksuite/store/workspace/migration/migrate-block': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'store',
+                'src/workspace/migration/migrate-block'
+              ),
+              '@blocksuite/store/providers/broadcast-channel': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'store',
+                'src/providers/broadcast-channel'
+              ),
+              '@blocksuite/store': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'store'
+              ),
+              '@blocksuite/virgo': resolve(
+                blocksuiteBaseDir,
+                'packages',
+                'virgo'
+              ),
+            },
     },
 
     cache: {
@@ -167,8 +229,7 @@ export const createConfiguration: (
           oneOf: [
             {
               test: /\.tsx?$/,
-              // Compile all ts files in the workspace
-              include: resolve(rootPath, '..', '..'),
+              exclude: /node_modules/,
               loader: require.resolve('swc-loader'),
               options: {
                 // https://swc.rs/docs/configuring-swc/
@@ -179,9 +240,10 @@ export const createConfiguration: (
                     dynamicImport: true,
                     topLevelAwait: false,
                     tsx: true,
+                    decorators: true,
                   },
                   target: 'es2022',
-                  externalHelpers: true,
+                  externalHelpers: false,
                   transform: {
                     react: {
                       runtime: 'automatic',
@@ -191,6 +253,7 @@ export const createConfiguration: (
                         emitFullSignatures: true,
                       },
                     },
+                    useDefineForClassFields: false,
                   },
                   experimental: {
                     keepImportAssertions: true,

apps/core/.webpack/utils.ts

@@ -7,5 +7,6 @@ export function computeCacheKey(buildFlags: BuildFlags) {
     buildFlags.mode,
     buildFlags.distribution,
     buildFlags.channel,
+    ...(process.env.LOCAL_BLOCK_SUITE ? [process.env.LOCAL_BLOCK_SUITE] : []),
   ].join('-');
 }

packages/cli/src/bin/dev-core.ts

@@ -28,6 +28,7 @@ const flags: BuildFlags = {
   mode: 'development',
   channel: 'canary',
   coverage: false,
+  localBlockSuite: undefined,
 };
 
 const buildFlags = await p.group(
@@ -79,6 +80,11 @@ const buildFlags = await p.group(
         message: 'Enable coverage',
         initialValue: process.env.COVERAGE === 'true',
       }),
+    debugBlockSuite: () =>
+      p.confirm({
+        message: 'Debug blocksuite locally?',
+        initialValue: false,
+      }),
   },
   {
     onCancel: () => {
@@ -88,6 +94,27 @@ const buildFlags = await p.group(
   }
 );
 
+if (buildFlags.debugBlockSuite) {
+  const { config } = await import('dotenv');
+  const envLocal = config({
+    path: path.resolve(cwd, '.env.local'),
+  });
+
+  const localBlockSuite = await p.text({
+    message: 'local blocksuite PATH',
+    initialValue: envLocal.error
+      ? undefined
+      : envLocal.parsed?.LOCAL_BLOCK_SUITE,
+  });
+  if (typeof localBlockSuite !== 'string') {
+    throw new Error('local blocksuite PATH is required');
+  }
+  if (!existsSync(localBlockSuite)) {
+    throw new Error(`local blocksuite not found: ${localBlockSuite}`);
+  }
+  flags.localBlockSuite = localBlockSuite;
+}
+
 flags.distribution = buildFlags.distribution as any;
 flags.mode = buildFlags.mode as any;
 flags.channel = buildFlags.channel as any;

packages/cli/src/config/index.ts

@@ -5,6 +5,7 @@ export type BuildFlags = {
   mode: 'development' | 'production';
   channel: 'stable' | 'beta' | 'canary' | 'internal';
   coverage?: boolean;
+  localBlockSuite?: string;
 };
 
 export const projectRoot = fileURLToPath(