feat: support debug with blocksuite (#582)

Co-authored-by: Yifeng Wang <doodlewind@toeverything.info>

packages/app/.env.local.template

@@ -5,3 +5,5 @@ NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=
 NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=
 NEXT_PUBLIC_FIREBASE_APP_ID=
 NEXT_PUBLIC_FIREBASE_MEASUREMENT_ID=
+# absolute path to the block suite directory
+LOCAL_BLOCK_SUITE=

packages/app/next.config.js

@@ -1,5 +1,6 @@
 const { getGitVersion, getCommitHash } = require('./scripts/gitInfo');
-const { dependencies } = require('./package.json')
+const { dependencies } = require('./package.json');
+const path = require('node:path');
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
@@ -13,7 +14,38 @@ const nextConfig = {
     CI: process.env.CI || null,
     VERSION: getGitVersion(),
     COMMIT_HASH: getCommitHash(),
-    EDITOR_VERSION: dependencies['@blocksuite/editor']
+    EDITOR_VERSION: dependencies['@blocksuite/editor'],
+  },
+  transpilePackages: process.env.LOCAL_BLOCK_SUITE
+    ? ['@blocksuite/editor', '@blocksuite/blocks', '@blocksuite/store']
+    : [],
+  webpack: config => {
+    if (
+      process.env.LOCAL_BLOCK_SUITE &&
+      path.isAbsolute(process.env.LOCAL_BLOCK_SUITE)
+    ) {
+      config.resolve.alias['yjs'] = require.resolve('yjs');
+      config.resolve.extensionAlias = {
+        '.js': ['.js', '.ts', '.tsx'],
+      };
+      const baseDir = process.env.LOCAL_BLOCK_SUITE;
+      config.resolve.alias['@blocksuite/editor'] = path.resolve(
+        baseDir,
+        'packages',
+        'editor'
+      );
+      config.resolve.alias['@blocksuite/blocks'] = path.resolve(
+        baseDir,
+        'packages',
+        'blocks'
+      );
+      config.resolve.alias['@blocksuite/store'] = path.resolve(
+        baseDir,
+        'packages',
+        'store'
+      );
+    }
+    return config;
   },
   images: {
     unoptimized: true,

packages/app/package.json

@@ -9,10 +9,10 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@blocksuite/blocks": "0.3.0-20221224062401-54874d6",
-    "@blocksuite/editor": "0.3.0-20221224062401-54874d6",
+    "@blocksuite/blocks": "0.3.0-20221224080508-0a1331a",
+    "@blocksuite/editor": "0.3.0-20221224080508-0a1331a",
     "@blocksuite/icons": "^2.0.2",
-    "@blocksuite/store": "0.3.0-20221224062401-54874d6",
+    "@blocksuite/store": "0.3.0-20221224080508-0a1331a",
     "@emotion/css": "^11.10.0",
     "@emotion/react": "^11.10.4",
     "@emotion/server": "^11.10.0",

packages/app/src/providers/app-state-provider/dynamic-blocksuite.tsx

@@ -6,7 +6,7 @@ import {
   Workspace as StoreWorkspace,
 } from '@blocksuite/store';
 import '@blocksuite/blocks';
-import '@blocksuite/blocks/style';
+import '@blocksuite/blocks/dist/style.css';
 import { BlockSchema, createEditor } from '@blocksuite/editor';
 import type { LoadWorkspaceHandler, CreateEditorHandler } from './context';
 import {