chore(monorepo): get webpack to run something

apps/client/.gitignore

@@ -1 +1,3 @@
-node_modules
+node_modules
+build
+!build/.gitkeep

apps/client/package.json

@@ -24,9 +24,13 @@
     "build:webpack-stats": "tsx node_modules/webpack/bin/webpack.js -c webpack.config.ts --profile --json=webpack-stats.json"
   },
   "devDependencies": {
+    "autoprefixer": "10.4.21",
+    "copy-webpack-plugin": "13.0.0",
+    "mini-css-extract-plugin": "2.9.2",
+    "tsx": "4.19.3",
     "webpack": "5.99.5",
     "webpack-cli": "6.0.1",
     "webpack-dev-middleware": "7.4.2",
-    "copy-webpack-plugin": "13.0.0"
+    "ts-loader": "9.5.2"
   }
 }

apps/client/src/asset_path.ts

@@ -0,0 +1,3 @@
+import packageJson from "../package.json" with { type: "json" };
+
+export default `assets/v${packageJson.version}`;

apps/client/tsconfig.json

@@ -0,0 +1,9 @@
+{
+    "compilerOptions": {
+        "module": "ESNext",
+        "moduleResolution": "bundler",
+        "resolveJsonModule": true,
+        "allowSyntheticDefaultImports": true
+    },
+    "include": [ "./src/**/*.ts" ]
+}

apps/client/webpack.config.ts

@@ -0,0 +1,133 @@
+import { fileURLToPath } from "url";
+import path from "path";
+import autoprefixer from "autoprefixer";
+import assetPath from "./src/asset_path.js";
+import miniCssExtractPlugin from "mini-css-extract-plugin";
+import type { Configuration } from "webpack";
+import CopyPlugin from "copy-webpack-plugin";
+
+const rootDir = path.dirname(fileURLToPath(import.meta.url));
+const config: Configuration = {
+    mode: "production",
+    entry: {
+        setup: "./src/setup.js",
+        login: "./src/login.js",
+        mobile: "./src/mobile.js",
+        desktop: "./src/desktop.js",
+        share: "./src/share.js",
+        // TriliumNextTODO: integrate set_password into setup entry point/view
+        set_password: "./src/set_password.js"
+    },
+    output: {
+        publicPath: `${assetPath}/app-dist/`,
+        path: path.resolve(rootDir, "build"),
+        filename: "[name].js"
+    },
+    plugins: [
+        new miniCssExtractPlugin({
+            // TriliumNextTODO: enable this, once webpack build outputs into the "build" folder, instead of "src/public/app-dist" folder => @pano9000
+            //filename: "../stylesheets/[name].css"
+        }),
+        new CopyPlugin({
+            patterns: [
+                {
+                    context: "node_modules/@excalidraw/excalidraw/dist/prod/fonts/",
+                    from: "**/*",
+                    to: "excalidraw/fonts/"
+                }
+            ]
+        })
+    ],
+    module: {
+        rules: [
+            {
+                test: /\.ts$/,
+                use: [
+                    {
+                        loader: "ts-loader",
+                        options: {
+                            configFile: path.join(rootDir, "tsconfig.json")
+                        }
+                    }
+                ],
+                exclude: /node_modules/
+            },
+            {
+                test: /\.m?js$/,
+                resolve: {
+                    fullySpecified: false
+                }
+            },
+            {
+                // bootstrap CSS related configuration
+                test: /\.(css)$/,
+                use: [
+                    {
+                        loader: miniCssExtractPlugin.loader
+                    },
+                    {
+                        loader: "css-loader",
+                        options: {
+                            esModule: true
+                        }
+                    },
+                    {
+                        loader: "postcss-loader",
+                        options: {
+                            postcssOptions: {
+                                plugins: [autoprefixer]
+                            }
+                        }
+                    }
+                ]
+            },
+            {
+                // bootstrap CSS related configuration
+                test: /\.(scss)$/,
+                use: [
+                    {
+                        loader: miniCssExtractPlugin.loader
+                    },
+                    {
+                        loader: "css-loader"
+                    },
+                    {
+                        loader: "postcss-loader",
+                        options: {
+                            postcssOptions: {
+                                plugins: [autoprefixer]
+                            }
+                        }
+                    },
+                    {
+                        loader: "sass-loader"
+                    }
+                ]
+            },
+            {
+                test: /\.(png)$/i,
+                type: 'asset/resource'
+            }
+        ]
+    },
+    resolve: {
+        extensions: [".ts", ".js"],
+        extensionAlias: {
+            ".js": [".js", ".ts"],
+            ".cjs": [".cjs", ".cts"],
+            ".mjs": [".mjs", ".mts"]
+        },
+        alias: {
+            stylesheets: path.resolve(rootDir, "src/public/stylesheets")
+        }
+    },
+    stats: {
+        all: false,
+        assets: true,
+        groupAssetsByChunk: true
+    },
+    devtool: "nosources-source-map",
+    target: "electron-renderer"
+};
+
+export default config;