refactor(nx/client): use composable webpack config

apps/client/webpack.config.cjs

@@ -1,12 +1,67 @@
 
-const { NxAppWebpackPlugin } = require('@nx/webpack/app-plugin');
+const { composePlugins, withNx, withWeb } = require('@nx/webpack');
 const { join } = require('path');
 
-module.exports = {
+module.exports = composePlugins(
-  output: {
+  withNx({
-    path: join(__dirname, 'dist'),
+    tsConfig: join(__dirname, './tsconfig.app.json'),
+    compiler: "tsc",
+    main: join(__dirname, "./src/index.ts"),
+    additionalEntryPoints: [
+      {
+          entryName: "desktop",
+          entryPath: join(__dirname, "./src/desktop.ts")
       },
-  devServer: {
+      {
+          entryName: "mobile",
+          entryPath: join(__dirname, "./src/mobile.ts")
+      },
+      {
+          entryName: "login",
+          entryPath: join(__dirname, "./src/login.ts")
+      },
+      {
+          entryName: "setup",
+          entryPath: join(__dirname, "./src/setup.ts")
+      },
+      {
+          entryName: "share",
+          entryPath: join(__dirname, "./src/share.ts")
+      },
+      {
+          // TriliumNextTODO: integrate set_password into setup entry point/view
+          entryName: "set_password",
+          entryPath: join(__dirname, "./src/set_password.ts")
+      }
+    ],
+    externalDependencies: [
+      "electron"
+    ],
+    baseHref: '/',
+    assets: [
+      join(__dirname, "./src/assets"),
+      join(__dirname, "./src/stylesheets"),
+      join(__dirname, "./src/libraries"),
+      join(__dirname, "./src/fonts"),
+      join(__dirname, "./src/translations")
+    ],
+    outputHashing: false,
+    optimization: process.env['NODE_ENV'] === 'production'
+  }),
+  withWeb({
+    styles: [],
+    stylePreprocessorOptions: {
+      sassOptions: {
+          quietDeps: true
+      }
+    },
+  }),
+  (config) => {
+    config.output = {
+      path: join(__dirname, 'dist')
+    };
+
+    config.devServer = {
       port: 4200,
       client: {
           overlay: {
@@ -15,66 +70,14 @@ module.exports = {
               runtimeErrors: true
           }
       }
-  },
-  plugins: [
-    new NxAppWebpackPlugin({
-      tsConfig: './tsconfig.app.json',
-      compiler: 'swc',
-      main: "./src/index.ts",
-      additionalEntryPoints: [
-        {
-            entryName: "desktop",
-            entryPath: "./src/desktop.ts"
-        },
-        {
-            entryName: "mobile",
-            entryPath: "./src/mobile.ts"
-        },
-        {
-            entryName: "login",
-            entryPath: "./src/login.ts"
-        },
-        {
-            entryName: "setup",
-            entryPath: "./src/setup.ts"
-        },
-        {
-            entryName: "share",
-            entryPath: "./src/share.ts"
-        },
-        {
-            // TriliumNextTODO: integrate set_password into setup entry point/view
-            entryName: "set_password",
-            entryPath: "./src/set_password.ts"
     }
-      ],
+
-      externalDependencies: [
+    config.resolve.fallback = {
-        "electron"
-      ],
-      baseHref: '/',
-      assets: [
-        "./src/assets",
-        "./src/stylesheets",
-        "./src/libraries",
-        "./src/fonts",
-        "./src/translations"
-      ],
-      styles: [],
-      stylePreprocessorOptions: {
-        sassOptions: {
-            quietDeps: true
-        }
-      },
-      outputHashing: false,
-      optimization: process.env['NODE_ENV'] === 'production',
-    })
-  ],
-  resolve: {
-    fallback: {
       path: false,
       fs: false,
       util: false
-    }
+    };
-  }
-};
 
+    return config;
+  }
+);