feat(client): migration old package to rspack (#15068)

#### PR Dependency Tree


* **PR #15068** 👈

This tree was auto-generated by
[Charcoal](https://github.com/danerwilliams/charcoal)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit

* **Chores**
* Upgraded Vitest across packages to 4.1.8 and bumped Tailwind PostCSS
to 4.3.0
* CLI/tooling updated to support the media-capture-playground package
and adjust build/dev server behavior

* **Bug Fixes**
  * Improved workspace deletion reliability in the Electron app

* **Refactor**
* Simplified media capture playground build setup (build/config
adjustments)

* **Tests**
* Made tests more robust by preserving/restoring environment state
during runs
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

blocksuite/affine/all/package.json

@@ -299,6 +299,6 @@
   "devDependencies": {
     "@vanilla-extract/vite-plugin": "^5.0.0",
     "msw": "^2.13.2",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   }
 }

blocksuite/affine/all/vitest.config.ts

@@ -1,3 +1,5 @@
+import { fileURLToPath } from 'node:url';
+
 import { vanillaExtractPlugin } from '@vanilla-extract/vite-plugin';
 import { defineConfig } from 'vitest/config';
 
@@ -7,7 +9,9 @@ export default defineConfig({
   },
   plugins: [vanillaExtractPlugin()],
   test: {
-    globalSetup: '../../../scripts/vitest-global.js',
+    globalSetup: fileURLToPath(
+      new URL('../../../scripts/vitest-global.js', import.meta.url)
+    ),
     include: ['src/__tests__/**/*.unit.spec.ts'],
     testTimeout: 1000,
     coverage: {

blocksuite/affine/blocks/bookmark/package.json

@@ -29,9 +29,9 @@
     "yjs": "^13.6.27"
   },
   "devDependencies": {
-    "@vitest/browser-playwright": "^4.0.18",
+    "@vitest/browser-playwright": "^4.1.8",
     "playwright": "=1.58.2",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts",

blocksuite/affine/blocks/surface/package.json

@@ -28,7 +28,7 @@
     "yjs": "^13.6.27"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts",

blocksuite/affine/data-view/package.json

@@ -30,7 +30,7 @@
     "zod": "^3.25.76"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts",

blocksuite/affine/data-view/vitest.config.ts

@@ -1,3 +1,5 @@
+import { fileURLToPath } from 'node:url';
+
 import { defineConfig } from 'vitest/config';
 
 export default defineConfig({
@@ -5,7 +7,9 @@ export default defineConfig({
     target: 'es2018',
   },
   test: {
-    globalSetup: '../../scripts/vitest-global.js',
+    globalSetup: fileURLToPath(
+      new URL('../../../scripts/vitest-global.js', import.meta.url)
+    ),
     include: ['src/__tests__/**/*.unit.spec.ts'],
     testTimeout: 1000,
     coverage: {

blocksuite/affine/ext-loader/package.json

@@ -15,7 +15,7 @@
     "zod": "^3.25.76"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts"

blocksuite/affine/gfx/group/package.json

@@ -26,7 +26,7 @@
     "lit": "^3.2.0"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts",

blocksuite/affine/gfx/group/vitest.config.ts

@@ -1,3 +1,5 @@
+import { fileURLToPath } from 'node:url';
+
 import { defineConfig } from 'vitest/config';
 
 export default defineConfig({
@@ -5,7 +7,9 @@ export default defineConfig({
     target: 'es2018',
   },
   test: {
-    globalSetup: '../../../scripts/vitest-global.js',
+    globalSetup: fileURLToPath(
+      new URL('../../../../scripts/vitest-global.js', import.meta.url)
+    ),
     include: ['src/__tests__/**/*.unit.spec.ts'],
     testTimeout: 1000,
     coverage: {

blocksuite/affine/gfx/pointer/package.json

@@ -22,7 +22,7 @@
     "lit": "^3.2.0"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts",

blocksuite/affine/gfx/pointer/vitest.config.ts

@@ -1,3 +1,5 @@
+import { fileURLToPath } from 'node:url';
+
 import { defineConfig } from 'vitest/config';
 
 export default defineConfig({
@@ -5,7 +7,9 @@ export default defineConfig({
     target: 'es2018',
   },
   test: {
-    globalSetup: '../../../scripts/vitest-global.js',
+    globalSetup: fileURLToPath(
+      new URL('../../../../scripts/vitest-global.js', import.meta.url)
+    ),
     include: ['src/__tests__/**/*.unit.spec.ts'],
     testTimeout: 1000,
     coverage: {

blocksuite/affine/inlines/footnote/package.json

@@ -25,9 +25,9 @@
     "zod": "^3.25.76"
   },
   "devDependencies": {
-    "@vitest/browser-playwright": "^4.0.18",
+    "@vitest/browser-playwright": "^4.1.8",
     "playwright": "=1.58.2",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts",

blocksuite/affine/shared/package.json

@@ -73,7 +73,7 @@
   ],
   "devDependencies": {
     "@types/pdfmake": "^0.2.12",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "version": "0.26.3"
 }

blocksuite/affine/shared/vitest.config.ts

@@ -1,3 +1,5 @@
+import { fileURLToPath } from 'node:url';
+
 import { defineConfig } from 'vitest/config';
 
 export default defineConfig({
@@ -5,7 +7,9 @@ export default defineConfig({
     target: 'es2018',
   },
   test: {
-    globalSetup: '../../../scripts/vitest-global.js',
+    globalSetup: fileURLToPath(
+      new URL('../../../scripts/vitest-global.js', import.meta.url)
+    ),
     include: ['src/__tests__/**/*.unit.spec.ts'],
     testTimeout: 1000,
     coverage: {

blocksuite/framework/global/package.json

@@ -61,7 +61,7 @@
     "rxjs": "^7.8.2"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "version": "0.26.3"
 }

blocksuite/framework/std/package.json

@@ -33,9 +33,9 @@
     "zod": "^3.25.76"
   },
   "devDependencies": {
-    "@vitest/browser-playwright": "^4.0.18",
+    "@vitest/browser-playwright": "^4.1.8",
     "playwright": "=1.58.2",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts",

blocksuite/framework/store/package.json

@@ -25,7 +25,7 @@
     "zod": "^3.25.76"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     ".": "./src/index.ts",

blocksuite/framework/sync/package.json

@@ -19,7 +19,7 @@
     "y-protocols": "^1.0.6"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "peerDependencies": {
     "yjs": "*"

blocksuite/integration-test/package.json

@@ -35,11 +35,11 @@
   ],
   "devDependencies": {
     "@vanilla-extract/vite-plugin": "^5.0.0",
-    "@vitest/browser-playwright": "^4.0.18",
+    "@vitest/browser-playwright": "^4.1.8",
     "playwright": "=1.58.2",
     "vite": "^7.2.7",
     "vite-plugin-wasm": "^3.5.0",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "version": "0.26.3"
 }

package.json

@@ -64,9 +64,9 @@
     "@types/node": "^22.0.0",
     "@typescript-eslint/parser": "^8.55.0",
     "@vanilla-extract/vite-plugin": "^5.0.0",
-    "@vitest/browser": "^4.0.18",
+    "@vitest/browser": "^4.1.8",
-    "@vitest/coverage-istanbul": "^4.0.18",
+    "@vitest/coverage-istanbul": "^4.1.8",
-    "@vitest/ui": "^4.0.18",
+    "@vitest/ui": "^4.1.8",
     "cross-env": "^10.1.0",
     "electron": "^39.0.0",
     "eslint": "^9.39.2",
@@ -91,7 +91,7 @@
     "typescript-eslint": "^8.55.0",
     "unplugin-swc": "^1.5.9",
     "vite": "^7.2.7",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "packageManager": "yarn@4.13.0",
   "resolutions": {

packages/backend/server/src/__tests__/models/feature-user.spec.ts

@@ -150,20 +150,26 @@ test('should not switch user quota if the new quota is the same as the current o
 });
 
 test('should use pro plan as free for selfhost instance', async t => {
+  const previousDeploymentType = env.DEPLOYMENT_TYPE;
   // @ts-expect-error DEPLOYMENT_TYPE is readonly
   env.DEPLOYMENT_TYPE = 'selfhosted';
-  await using module = await createTestingModule();
+  try {
+    await using module = await createTestingModule();
 
-  const models = module.get(Models);
+    const models = module.get(Models);
-  const u1 = await models.user.create({
+    const u1 = await models.user.create({
-    email: 'u1@affine.pro',
+      email: 'u1@affine.pro',
-    registered: true,
+      registered: true,
-  });
+    });
 
-  await models.userFeature.add(u1.id, 'free_plan_v1', 'legacy projection');
+    await models.userFeature.add(u1.id, 'free_plan_v1', 'legacy projection');
-  const quota = await models.userFeature.getQuota(u1.id);
+    const quota = await models.userFeature.getQuota(u1.id);
-  t.snapshot(
+    t.snapshot(
-    quota?.configs,
+      quota?.configs,
-    'use pro plan as free plan for selfhosted instance'
+      'use pro plan as free plan for selfhosted instance'
-  );
+    );
+  } finally {
+    // @ts-expect-error DEPLOYMENT_TYPE is readonly
+    env.DEPLOYMENT_TYPE = previousDeploymentType;
+  }
 });

packages/backend/server/src/core/quota/__tests__/state.spec.ts

@@ -327,6 +327,9 @@ test.after.always(async t => {
 });
 
 test('reconciles quota states from entitlements and business tables', async t => {
+  const previousDeploymentType = globalThis.env.DEPLOYMENT_TYPE;
+  // @ts-expect-error test mutates env singleton for cloud entitlement semantics
+  globalThis.env.DEPLOYMENT_TYPE = 'affine';
   const cases = [
     {
       name: 'owner fallback uses user entitlement and owner storage usage',
@@ -444,10 +447,15 @@ test('reconciles quota states from entitlements and business tables', async t =>
     },
   ];
 
-  for (const item of cases) {
+  try {
-    await t.context.module.initTestingDB();
+    for (const item of cases) {
-    const state = await item.setup();
+      await t.context.module.initTestingDB();
-    await item.assert(state);
+      const state = await item.setup();
+      await item.assert(state);
+    }
+  } finally {
+    // @ts-expect-error restore mutable test env singleton
+    globalThis.env.DEPLOYMENT_TYPE = previousDeploymentType;
   }
 });
 

packages/common/debug/package.json

@@ -10,7 +10,7 @@
   },
   "devDependencies": {
     "@types/debug": "^4.1.12",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "version": "0.26.3"
 }

packages/common/env/package.json

@@ -3,7 +3,7 @@
   "private": true,
   "type": "module",
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "exports": {
     "./automation": "./src/automation.ts",

packages/common/error/package.json

@@ -11,6 +11,6 @@
     "graphql": "^16.9.0"
   },
   "devDependencies": {
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   }
 }

packages/common/graphql/package.json

@@ -17,7 +17,7 @@
     "@graphql-codegen/typescript-operations": "^5.0.9",
     "@types/lodash-es": "^4.17.12",
     "prettier": "^3.7.4",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "scripts": {
     "build": "gql-gen --errors-only"

packages/common/infra/package.json

@@ -32,7 +32,7 @@
     "@testing-library/react": "^16.1.0",
     "@types/react": "^19.0.1",
     "rxjs": "^7.8.2",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "peerDependencies": {
     "electron": "*",

packages/common/nbstore/package.json

@@ -38,7 +38,7 @@
     "fake-indexeddb": "^6.0.0",
     "idb": "^8.0.0",
     "socket.io-client": "^4.8.3",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "peerDependencies": {
     "@affine/error": "workspace:*",

packages/common/reader/package.json

@@ -19,7 +19,7 @@
   },
   "devDependencies": {
     "@blocksuite/affine": "workspace:*",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "peerDependencies": {
     "@blocksuite/affine": "workspace:*"

packages/frontend/admin/package.json

@@ -65,7 +65,7 @@
     "tailwind-merge": "^3.4.0",
     "tailwindcss": "^4.1.17",
     "tailwindcss-animate": "^1.0.7",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "scripts": {
     "build": "affine bundle",

packages/frontend/apps/electron/package.json

@@ -51,7 +51,6 @@
     "@sentry/esbuild-plugin": "^5.3.0",
     "@toeverything/infra": "workspace:*",
     "@types/set-cookie-parser": "^2.4.10",
-    "@vitejs/plugin-react": "^5.2.0",
     "app-builder-lib": "^26.8.1",
     "builder-util-runtime": "^9.5.1",
     "cross-env": "^10.1.0",
@@ -71,7 +70,7 @@
     "tree-kill": "^1.2.2",
     "typescript": "^5.9.3",
     "uuid": "^14.0.0",
-    "vitest": "^4.0.18",
+    "vitest": "^4.1.8",
     "zod": "^3.25.76"
   },
   "dependencies": {

packages/frontend/apps/electron/src/helper/workspace/handlers.ts

@@ -31,7 +31,7 @@ async function deleteWorkspaceV1(workspaceId: string) {
   try {
     await ensureSQLiteDisconnected('workspace', workspaceId);
     const basePath = await getWorkspaceBasePathV1('workspace', workspaceId);
-    await fs.rmdir(basePath, { recursive: true });
+    await fs.remove(basePath);
   } catch (error) {
     logger.error('deleteWorkspaceV1', error);
   }
@@ -47,7 +47,7 @@ export async function deleteWorkspace(universalId: string) {
   const dbPath = await getSpaceDBPath(peer, type, id);
   try {
     await getDocStoragePool().disconnect(universalId);
-    await fs.rmdir(path.dirname(dbPath), { recursive: true });
+    await fs.remove(path.dirname(dbPath));
   } catch (e) {
     logger.error('deleteWorkspace', e);
   }
@@ -78,7 +78,7 @@ export async function trashWorkspace(universalId: string) {
     await fs.copy(path.dirname(dbPath), movedPath, {
       overwrite: true,
     });
-    await fs.rmdir(path.dirname(dbPath), { recursive: true });
+    await fs.remove(path.dirname(dbPath));
   } catch (error) {
     logger.error('trashWorkspace', error);
   }
@@ -331,7 +331,7 @@ async function importWorkspaceDb(originalPath: string) {
 export async function deleteBackupWorkspace(id: string) {
   const basePath = await getDeletedWorkspacesBasePath();
   const workspacePath = path.join(basePath, normalizeWorkspaceIdForPath(id));
-  await fs.rmdir(workspacePath, { recursive: true });
+  await fs.remove(workspacePath);
   logger.info(
     'deleteBackupWorkspace',
     `Deleted backup workspace: ${workspacePath}`

packages/frontend/apps/electron/vitest.config.ts

@@ -2,13 +2,11 @@
 import { resolve } from 'node:path';
 import { fileURLToPath } from 'node:url';
 
-import react from '@vitejs/plugin-react';
 import { defineConfig } from 'vitest/config';
 
 const rootDir = fileURLToPath(new URL('../../../..', import.meta.url));
 
 export default defineConfig({
-  plugins: [react()],
   resolve: {
     alias: {
       // prevent tests using two different sources of yjs

packages/frontend/apps/mobile-shared/package.json

@@ -14,6 +14,6 @@
   },
   "devDependencies": {
     "typescript": "^5.9.3",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   }
 }

packages/frontend/component/package.json

@@ -82,7 +82,7 @@
     "typescript": "^5.9.3",
     "unplugin-swc": "^1.5.9",
     "vite": "^7.2.7",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "version": "0.26.3"
 }

packages/frontend/core/package.json

@@ -107,6 +107,6 @@
     "@vanilla-extract/css": "^1.17.0",
     "fake-indexeddb": "^6.0.0",
     "happy-dom": "^20.3.0",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   }
 }

packages/frontend/i18n/package.json

@@ -29,6 +29,6 @@
     "@affine-tools/cli": "workspace:*",
     "@affine-tools/utils": "workspace:*",
     "glob": "^11.0.0",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   }
 }

packages/frontend/media-capture-playground/package.json

@@ -4,19 +4,18 @@
   "type": "module",
   "version": "0.26.3",
   "scripts": {
-    "dev:web": "vite",
+    "dev:web": "affine bundle --dev",
+    "build:web": "affine bundle",
     "dev:server": "node --env-file-if-exists=.env --watch server/main.ts"
   },
   "dependencies": {
     "@affine/native": "workspace:*",
     "@google/generative-ai": "^0.24.0",
-    "@tailwindcss/vite": "^4.0.6",
     "@types/express": "^5.0.0",
     "@types/lodash-es": "^4.17.12",
     "@types/multer": "^2.0.0",
     "@types/react": "^19.0.8",
     "@types/react-dom": "^19.0.3",
-    "@vitejs/plugin-react": "^5.2.0",
     "chokidar": "^4.0.3",
     "express": "^5.0.0",
     "express-rate-limit": "^7.1.5",
@@ -29,8 +28,7 @@
     "socket.io": "^4.7.4",
     "socket.io-client": "^4.8.3",
     "swr": "^2.3.7",
-    "tailwindcss": "^4.1.17",
+    "tailwindcss": "^4.1.17"
-    "vite": "^7.3.1"
   },
   "devDependencies": {
     "@types/fs-extra": "^11",

packages/frontend/media-capture-playground/vite.config.ts

@@ -1,18 +0,0 @@
-import tailwindcss from '@tailwindcss/vite';
-import react from '@vitejs/plugin-react';
-import { defineConfig } from 'vite';
-
-// https://vite.dev/config/
-export default defineConfig({
-  plugins: [react(), tailwindcss()],
-  root: './web',
-  server: {
-    proxy: {
-      '/api': {
-        target: 'http://localhost:6544',
-        changeOrigin: true,
-        rewrite: path => path.replace(/^\/api/, ''),
-      },
-    },
-  },
-});

packages/frontend/media-capture-playground/web/index.html

@@ -2,12 +2,10 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Media Capture Playground</title>
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/main.tsx"></script>
   </body>
 </html>

packages/frontend/routes/package.json

@@ -13,7 +13,7 @@
     "@affine-tools/cli": "workspace:*",
     "@affine-tools/utils": "workspace:*",
     "path-to-regexp": "^8.4.2",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   },
   "peerDependencies": {
     "react": "^19.2.1",

packages/frontend/track/package.json

@@ -14,6 +14,6 @@
   },
   "devDependencies": {
     "@types/react": "^19.0.1",
-    "vitest": "^4.0.18"
+    "vitest": "^4.1.8"
   }
 }

tools/cli/package.json

@@ -22,7 +22,7 @@
     "@rspack/dev-server": "^2.0.1",
     "@sentry/webpack-plugin": "^5.3.0",
     "@swc/core": "^1.10.1",
-    "@tailwindcss/postcss": "^4.0.0",
+    "@tailwindcss/postcss": "^4.3.0",
     "@vanilla-extract/webpack-plugin": "^2.3.15",
     "autoprefixer": "^10.4.20",
     "clipanion": "^3.2.1",

tools/cli/src/bundle-shared.ts

@@ -9,6 +9,7 @@ export const RSPACK_SUPPORTED_PACKAGES = [
   '@affine/electron-renderer',
   '@affine/server',
   '@affine/reader',
+  '@affine/media-capture-playground',
 ] as const;
 
 const rspackSupportedPackageSet = new Set<string>(RSPACK_SUPPORTED_PACKAGES);

tools/cli/src/bundle.ts

@@ -194,11 +194,41 @@ function getRspackBundleConfigs(pkg: Package): MultiRspackOptions {
         }),
       ] as MultiRspackOptions;
     }
+    case '@affine/media-capture-playground': {
+      return [
+        createRspackHTMLTargetConfig(pkg, pkg.join('web/main.tsx').value, {
+          template: pkg.join('web/index.html').value,
+          additionalEntryForSelfhost: false,
+          copySharedPublicAssets: false,
+          injectGlobalErrorHandler: false,
+          emitAssetsManifest: false,
+        }),
+      ] as MultiRspackOptions;
+    }
   }
 
   throw new Error(`Unsupported package: ${pkg.name}`);
 }
 
+function getRspackDevServerConfig(
+  pkg: Package
+): RspackDevServerConfiguration | undefined {
+  if (pkg.name !== '@affine/media-capture-playground') {
+    return;
+  }
+
+  return {
+    proxy: [
+      {
+        context: '/api',
+        target: 'http://localhost:6544',
+        changeOrigin: true,
+        pathRewrite: { '^/api': '' },
+      },
+    ],
+  };
+}
+
 export class BundleCommand extends PackageCommand {
   static override paths = [['bundle'], ['pack'], ['bun']];
 
@@ -214,7 +244,7 @@ export class BundleCommand extends PackageCommand {
     const pkg = this.workspace.getPackage(this.package);
 
     if (this.dev) {
-      await BundleCommand.dev(pkg);
+      await BundleCommand.dev(pkg, getRspackDevServerConfig(pkg));
     } else {
       await BundleCommand.build(pkg);
     }
@@ -294,10 +324,12 @@ export class BundleCommand extends PackageCommand {
       throw new Error('Failed to create rspack compiler');
     }
 
-    const devServer = new RspackDevServer(
+    const serverConfig = merge({}, DEFAULT_DEV_SERVER_CONFIG, devServerConfig);
-      merge({}, DEFAULT_DEV_SERVER_CONFIG, devServerConfig),
+    if (devServerConfig?.proxy) {
-      compiler
+      serverConfig.proxy = devServerConfig.proxy;
-    );
+    }
+
+    const devServer = new RspackDevServer(serverConfig, compiler);
 
     await devServer.start();
   }

tools/cli/src/rspack-shared/html-plugin.ts

@@ -83,6 +83,8 @@ const currentDir = Path.dir(import.meta.url);
 
 export interface CreateHTMLPluginConfig {
   filename?: string;
+  template?: string;
+  copySharedPublicAssets?: boolean;
   additionalEntryForSelfhost?: boolean;
   selfhostPublicPath?: string;
   injectGlobalErrorHandler?: boolean;
@@ -209,7 +211,10 @@ export function createHTMLPlugins(
   config: CreateHTMLPluginConfig
 ): (HtmlRspackPluginInstance | PluginLike)[] {
   const publicPath = getPublicPath(BUILD_CONFIG);
-  const htmlPluginOptions = getHTMLPluginOptions(BUILD_CONFIG);
+  const htmlPluginOptions = {
+    ...getHTMLPluginOptions(BUILD_CONFIG),
+    ...(config.template ? { template: config.template } : {}),
+  };
   const selfhostPublicPath = config.selfhostPublicPath ?? '/';
 
   const plugins: (HtmlRspackPluginInstance | PluginLike)[] = [];

tools/cli/src/rspack/index.ts

@@ -77,12 +77,20 @@ export function createHTMLTargetConfig(
   deps?: string[]
 ): RspackConfiguration {
   entry = typeof entry === 'string' ? { index: entry } : entry;
+  const tailwindConfigPath = pkg.join('tailwind.config.js');
+  const hasTailwind =
+    tailwindConfigPath.exists() ||
+    pkg.name === '@affine/media-capture-playground';
+  const tailwindPlugin = tailwindConfigPath.exists()
+    ? ['@tailwindcss/postcss', require(tailwindConfigPath.value)]
+    : ['@tailwindcss/postcss'];
 
   htmlConfig = merge(
     {},
     {
       filename: 'index.html',
       additionalEntryForSelfhost: true,
+      copySharedPublicAssets: true,
       injectGlobalErrorHandler: true,
       emitAssetsManifest: true,
     },
@@ -268,12 +276,9 @@ export function createHTMLTargetConfig(
                   loader: 'postcss-loader',
                   options: {
                     postcssOptions: {
-                      plugins: pkg.join('tailwind.config.js').exists()
+                      plugins: hasTailwind
                         ? [
-                            [
+                            tailwindPlugin,
-                              '@tailwindcss/postcss',
-                              require(pkg.join('tailwind.config.js').value),
-                            ],
                             ['autoprefixer'],
                             ...(buildConfig.isAdmin
                               ? [queuedashScopePostcssPlugin()]
@@ -318,6 +323,7 @@ export function createHTMLTargetConfig(
         }),
       new VanillaExtractPlugin(),
       !buildConfig.isAdmin &&
+        htmlConfig.copySharedPublicAssets &&
         new rspack.CopyRspackPlugin({
           patterns: [
             {

tools/commitlint/.commitlintrc.json

@@ -27,7 +27,8 @@
         "infra",
         "editor",
         "tools",
-        "y-octo"
+        "y-octo",
+        "client"
       ]
     ]
   }

tools/utils/src/distribution.ts

@@ -6,6 +6,7 @@ export const PackageToDistribution = new Map<
 >([
   ['@affine/admin', 'admin'],
   ['@affine/web', 'web'],
+  ['@affine/media-capture-playground', 'web'],
   ['@affine/electron-renderer', 'desktop'],
   ['@affine/electron', 'desktop'],
   ['@affine/mobile', 'mobile'],