trying to set up webpack to run these files in the web, and close? I think?

packages/desktop/package.json

@@ -9,7 +9,8 @@
     "package": "electron-forge package",
     "make": "electron-forge make",
     "publish": "electron-forge publish",
-    "lint": "eslint --ext .ts,.tsx ."
+    "lint": "eslint --ext .ts,.tsx .",
+    "webpack:dev": "webpack serve --open --config webpack.web.config.js"
   },
   "keywords": [],
   "author": {
@@ -91,7 +92,9 @@
     "tailwindcss": "^3.0.23",
     "ts-loader": "^9.2.2",
     "typescript": "~4.5.4",
-    "webpack": "^5.72.0"
+    "webpack": "^5.72.0",
+    "webpack-cli": "^4.9.2",
+    "webpack-dev-server": "^4.9.0"
   },
   "dependencies": {
     "@getstation/electron-google-oauth2": "^2.1.0",

packages/desktop/webpack.web.config.js

@@ -0,0 +1,42 @@
+const rules = require("./webpack.rules");
+
+const plugins = require("./webpack.plugins");
+
+const path = require("path");
+
+rules.push({
+  test: /\.css$/,
+  use: [
+    { loader: "style-loader" },
+    { loader: "css-loader" },
+    {
+      loader: "postcss-loader",
+      options: {
+        postcssOptions: {
+          config: path.join(__dirname, "postcss.config.js"),
+        },
+      },
+    },
+  ],
+});
+
+module.exports = {
+  mode: "development",
+  entry: "./src/app.tsx",
+  module: {
+    rules,
+  },
+  plugins: plugins,
+  resolve: {
+    extensions: [".js", ".ts", ".jsx", ".tsx", ".css"],
+  },
+  output: {
+    path: path.resolve(__dirname, "build"),
+    filename: "bundle.js",
+  },
+  devServer: {
+    static: path.join(__dirname, "build"),
+    compress: true,
+    port: 4000,
+  },
+};