fix(core): hmr issue on dev (#5006)

I suspect HMR does not working properly on dev because we have multiple entries.
One relative issue: https://github.com/webpack/webpack-dev-server/issues/2792/

I think we do not need multiple entries for polyfills & plugins after all. They could be in the same chunk, and could be later optimized through splitChunks option.

`ses.ts` is changed to `ses-lockdown.ts` because `ses.ts` does not pass circular dependency check by madge. I haven't looked through the real root cause though. See https://github.com/pahen/madge/issues/355

packages/frontend/core/.webpack/webpack.config.ts

@@ -19,26 +19,8 @@ export default async function (cli_env: any, _: any) {
   const config = createConfiguration(flags, runtimeConfig);
   return merge(config, {
     entry: {
-      'polyfill/intl-segmenter': {
+      app: resolve(rootPath, 'src/index.tsx'),
-        import: resolve(rootPath, 'src/polyfill/intl-segmenter.ts'),
+      '_plugin/index.test': resolve(rootPath, 'src/_plugin/index.test.tsx'),
-      },
-      'polyfill/ses': {
-        import: resolve(rootPath, 'src/polyfill/ses.ts'),
-      },
-      plugin: {
-        dependOn: ['polyfill/intl-segmenter', 'polyfill/ses'],
-        import: resolve(rootPath, 'src/bootstrap/register-plugins.ts'),
-      },
-      app: {
-        chunkLoading: 'import',
-        dependOn: ['polyfill/intl-segmenter', 'polyfill/ses', 'plugin'],
-        import: resolve(rootPath, 'src/index.tsx'),
-      },
-      '_plugin/index.test': {
-        chunkLoading: 'import',
-        dependOn: ['polyfill/intl-segmenter', 'polyfill/ses', 'plugin'],
-        import: resolve(rootPath, 'src/_plugin/index.test.tsx'),
-      },
     },
     plugins: [
       new HTMLPlugin({
@@ -46,7 +28,7 @@ export default async function (cli_env: any, _: any) {
         inject: 'body',
         scriptLoading: 'module',
         minify: false,
-        chunks: ['app', 'plugin', 'polyfill/intl-segmenter', 'polyfill/ses'],
+        chunks: ['app'],
         filename: 'index.html',
         templateParameters: {
           GIT_SHORT_SHA: gitShortHash(),
@@ -59,12 +41,7 @@ export default async function (cli_env: any, _: any) {
         scriptLoading: 'module',
         minify: false,
         publicPath: getPublicPath(flags),
-        chunks: [
+        chunks: ['_plugin/index.test'],
-          '_plugin/index.test',
-          'plugin',
-          'polyfill/intl-segmenter',
-          'polyfill/ses',
-        ],
         filename: '_plugin/index.html',
         templateParameters: {
           GIT_SHORT_SHA: gitShortHash(),

packages/frontend/core/src/_plugin/index.test.tsx

@@ -1,3 +1,6 @@
+import '../polyfill/ses-lockdown';
+import '../polyfill/intl-segmenter';
+
 import { assertExists } from '@blocksuite/global/utils';
 import {
   getCurrentStore,

packages/frontend/core/src/index.tsx

@@ -1,3 +1,6 @@
+import './polyfill/ses-lockdown';
+import './polyfill/intl-segmenter';
+
 import { WorkspaceFallback } from '@affine/component/workspace';
 import { assertExists } from '@blocksuite/global/utils';
 import { getCurrentStore } from '@toeverything/infra/atom';
@@ -36,4 +39,6 @@ async function main() {
   );
 }
 
-await main();
+main().catch(err => {
+  console.error('Failed to bootstrap app', err);
+});