feat: use raw-loader to replace the static markdownExample variable,just use markdown file

packages/app/next.config.js

@@ -19,6 +19,11 @@ const nextConfig = {
   },
   webpack: config => {
     config.resolve.alias['yjs'] = require.resolve('yjs');
+    config.module.rules.push({
+      test: /\.md$/i,
+      loader: 'raw-loader',
+    });
+
     return config;
   },
   images: {

packages/app/package.json

@@ -47,6 +47,7 @@
     "eslint-config-next": "12.3.1",
     "eslint-config-prettier": "^8.5.0",
     "eslint-plugin-prettier": "^4.2.1",
+    "raw-loader": "^4.0.2",
     "typescript": "4.8.3"
   },
   "eslintConfig": {

packages/app/src/pages/workspace/[workspaceId]/[pageId].tsx

@@ -11,7 +11,8 @@ import { EditorHeader } from '@/components/header';
 import EdgelessToolbar from '@/components/edgeless-toolbar';
 import MobileModal from '@/components/mobile-modal';
 import { useAppState } from '@/providers/app-state-provider/context';
-import exampleMarkdown from '@/static/example-markdown';
+
+import exampleMarkdown from '@/templates/Welcome-to-the-AFFiNE-Alpha.md';
 import type { NextPageWithLayout } from '../..//_app';
 import WorkspaceLayout from '@/components/workspace-layout';
 import { useRouter } from 'next/router';

packages/app/src/static/example-markdown.ts

@@ -1,62 +0,0 @@
-export const exampleMarkdown = `The AFFiNE Alpha is here! You can also view our [Official Website](https://affine.pro/)!
-
-**What's different in AFFiNE Alpha?**
-
-1.  A much ~smoother editing~ experience, with much ~greater stability~;
-2.  More complete ~Markdown~ support and improved ~keyboard shortcuts~;
-3.  New features such as ~dark mode~;
-    *   **Switch between view styles using the** ☀ **and** 🌙.
-4.  ~Clean and modern UI/UX~ design.
-
-**Looking for Markdown syntax or keyboard shortcuts?**
-
-*   Find the (?) in the bottom right, then the ️⌨️, to view a full list of \`Keyboard Shortcuts\`
-
-**Have an enjoyable editing experience !!!** 😃
-
-Have some feedback or just want to get in touch? Use the (?), then 🎧 to get in touch and join our communities.
-
-**Still in development**
-
-There are also some things you should consider about this AFFiNE Alpha including some ~limitations~:
-
-*   Single page editing - currently editing multiple docs/pages is not supported;
-*   Changes are not automatically stored, to save changes you should export your data. Options can be found by going to the top right and finding the \`⋮\` icon;
-*   Without an import/open feature you are still able to access your data by copying it back in.
-
-**Keyboard Shortcuts:**
-
-1.  Undo: \`⌘+Z\` or \`Ctrl+Z\`
-2.  Redo: \`⌘+⇧+Z\` or \`Ctrl+Shift+Z\`
-3.  Bold: \`⌘+B\` or \`Ctrl+B\`
-4.  Italic: \`⌘+I\` or \`Ctrl+I\`
-5.  Underline: \`⌘+U\` or \`Ctrl+U\`
-6.  Strikethrough: \`⌘+⇧+S\` or \`Ctrl+Shift+S\`
-7.  Inline code: \`⌘+E\` or \`Ctrl+E\`
-8.  Link: \`⌘+K\` or \`Ctrl+K\`
-9.  Body text: \`⌘+⌥+0\` or \`Ctrl+Shift+0\`
-10.  Heading 1: \`⌘+⌥+1\` or \`Ctrl+Shift+1\`
-11.  Heading 2: \`⌘+⌥+2\` or \`Ctrl+Shift+2\`
-12.  Heading 3: \`⌘+⌥+3\` or \`Ctrl+Shift+3\`
-13.  Heading 4: \`⌘+⌥+4\` or \`Ctrl+Shift+4\`
-14.  Heading 5: \`⌘+⌥+5\` or \`Ctrl+Shift+5\`
-15.  Heading 6: \`⌘+⌥+6\` or \`Ctrl+Shift+6\`
-16.  Increase indent: \`Tab\`
-17.  Reduce indent: \`⇧+Tab\` or \`Shift+Tab\`
-
-**Markdown Syntax:**
-
-1.  Bold: \`**text**\`
-2.  Italic: \`*text*\`
-3.  Underline: \`~text~\`
-4.  Strikethrough: \`~~text~~\`
-5.  Inline code: \`\` \`text\` \`\`
-6.  Heading 1: \`# text\`
-7.  Heading 2: \`## text\`
-8.  Heading 3: \`### text\`
-9.  Heading 4: \`#### text\`
-10.  Heading 5: \`##### text\`
-11.  Heading 6: \`###### text\`
-`;
-
-export default exampleMarkdown;

pnpm-lock.yaml

@@ -74,6 +74,7 @@ importers:
       prettier: ^2.7.1
       quill: ^1.3.7
       quill-cursors: ^4.0.0
+      raw-loader: ^4.0.2
       react: 18.2.0
       react-dom: 18.2.0
       react-i18next: ^11.18.4
@@ -117,6 +118,7 @@ importers:
       eslint-config-next: 12.3.1_76twfck5d7crjqrmw4yltga7zm
       eslint-config-prettier: 8.5.0_eslint@8.22.0
       eslint-plugin-prettier: 4.2.1_i2cojdczqdiurzgttlwdgf764e
+      raw-loader: 4.0.2
       typescript: 4.8.3
 
   packages/data-services:
@@ -2681,6 +2683,14 @@ packages:
       indent-string: 4.0.0
     dev: true
 
+  /ajv-keywords/3.5.2_ajv@6.12.6:
+    resolution: {integrity: sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==}
+    peerDependencies:
+      ajv: ^6.9.1
+    dependencies:
+      ajv: 6.12.6
+    dev: true
+
   /ajv/6.12.6:
     resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
     dependencies:
@@ -2925,6 +2935,10 @@ packages:
     resolution: {integrity: sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA==}
     dev: false
 
+  /big.js/5.2.2:
+    resolution: {integrity: sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==}
+    dev: true
+
   /brace-expansion/1.1.11:
     resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==}
     dependencies:
@@ -3375,6 +3389,11 @@ packages:
     resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
     dev: true
 
+  /emojis-list/3.0.0:
+    resolution: {integrity: sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==}
+    engines: {node: '>= 4'}
+    dev: true
+
   /encoding/0.1.13:
     resolution: {integrity: sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==}
     dependencies:
@@ -5390,6 +5409,15 @@ packages:
       lit-html: 2.5.0
     dev: false
 
+  /loader-utils/2.0.4:
+    resolution: {integrity: sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==}
+    engines: {node: '>=8.9.0'}
+    dependencies:
+      big.js: 5.2.2
+      emojis-list: 3.0.0
+      json5: 2.2.1
+    dev: true
+
   /locate-path/5.0.0:
     resolution: {integrity: sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==}
     engines: {node: '>=8'}
@@ -6073,6 +6101,16 @@ packages:
       safe-buffer: 5.2.1
     dev: false
 
+  /raw-loader/4.0.2:
+    resolution: {integrity: sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA==}
+    engines: {node: '>= 10.13.0'}
+    peerDependencies:
+      webpack: ^4.0.0 || ^5.0.0
+    dependencies:
+      loader-utils: 2.0.4
+      schema-utils: 3.1.1
+    dev: true
+
   /react-dom/18.2.0_react@18.2.0:
     resolution: {integrity: sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==}
     peerDependencies:
@@ -6336,6 +6374,15 @@ packages:
       loose-envify: 1.4.0
     dev: false
 
+  /schema-utils/3.1.1:
+    resolution: {integrity: sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw==}
+    engines: {node: '>= 10.13.0'}
+    dependencies:
+      '@types/json-schema': 7.0.11
+      ajv: 6.12.6
+      ajv-keywords: 3.5.2_ajv@6.12.6
+    dev: true
+
   /selenium-webdriver/4.5.0:
     resolution: {integrity: sha512-9mSFii+lRwcnT2KUAB1kqvx6+mMiiQHH60Y0VUtr3kxxi3oZ3CV3B8e2nuJ7T4SPb+Q6VA0swswe7rYpez07Bg==}
     engines: {node: '>= 14.20.0'}