From 9fd8d3da28275e4cc7b1503f39f51fb1a23b7f73 Mon Sep 17 00:00:00 2001
From: MrKBear <mrkbear@qq.com>
Date: Tue, 22 Feb 2022 22:08:12 +0800
Subject: [PATCH] Webpack add simulator web entry

---
 config/webpack.common.js                   |  5 ++
 config/webpack.web.js                      | 56 ++++++++++++++++++++++
 package.json                               |  5 +-
 source/Page/SimulatorWeb/SimulatorWeb.scss |  0
 source/Page/SimulatorWeb/SimulatorWeb.tsx  | 14 ++++++
 5 files changed, 79 insertions(+), 1 deletion(-)
 create mode 100644 config/webpack.web.js
 create mode 100644 source/Page/SimulatorWeb/SimulatorWeb.scss
 create mode 100644 source/Page/SimulatorWeb/SimulatorWeb.tsx

diff --git a/config/webpack.common.js b/config/webpack.common.js
index 16688f4..fc9ff97 100644
--- a/config/webpack.common.js
+++ b/config/webpack.common.js
@@ -65,6 +65,11 @@ const Entry = () => ({
     LaboratoryPage: {
         import: source("./Page/Laboratory/Laboratory.tsx"),
         dependOn: ["Model", "GLRender"]
+    },
+
+    SimulatorWeb: {
+        import: source("./Page/SimulatorWeb/SimulatorWeb.tsx"),
+        dependOn: ["Model", "GLRender"]
     }
 });
 
diff --git a/config/webpack.web.js b/config/webpack.web.js
new file mode 100644
index 0000000..5f347e6
--- /dev/null
+++ b/config/webpack.web.js
@@ -0,0 +1,56 @@
+const { 
+    Entry, Output, resolve, build,
+    TypeScriptRules, ScssRules,
+    HTMLPage, CssPlugin, AutoFixCssPlugin
+} = require("./webpack.common");
+
+const AllEntry = Entry();
+
+module.exports = (env) => {
+    
+    const config = {
+
+        entry: {
+            GLRender: AllEntry.GLRender,
+            Model: AllEntry.Model,
+            SimulatorWeb: AllEntry.SimulatorWeb
+        },
+
+        output: Output("[name].[contenthash].js"),
+        devtool: 'source-map',
+        mode: "development",
+        resolve: resolve(),
+
+        optimization: {
+            runtimeChunk: 'single',
+            chunkIds: 'named',
+            moduleIds: 'named',
+            splitChunks: {
+                chunks: 'all',
+                minSize: 1000
+            }
+        },
+
+        module: {
+            rules: [
+                TypeScriptRules(),
+                ScssRules()
+            ]
+        },
+        
+        plugins: [
+            HTMLPage("index.html", "Living Together | Simulator"),
+            CssPlugin(),
+            AutoFixCssPlugin()
+        ],
+        
+        devServer: {
+            static: {
+                directory: build("./"),
+            },
+            port: 12000,
+        }
+    };
+
+    return config;
+};
\ No newline at end of file
diff --git a/package.json b/package.json
index 131b7ab..8690bb2 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,10 @@
     "clean": "rimraf ./build/*",
     "hmr-lab": "webpack serve --open --config ./config/webpack.lab.js",
     "build-lab": "npm run clean & webpack --mode development --config ./config/webpack.lab.js",
-    "release-lab": "npm run clean & webpack --mode production --no-devtool --config ./config/webpack.lab.js"
+    "release-lab": "npm run clean & webpack --mode production --no-devtool --config ./config/webpack.lab.js",
+    "hmr-web": "webpack serve --open --config ./config/webpack.web.js",
+    "build-web": "npm run clean & webpack --mode development --config ./config/webpack.web.js",
+    "release-web": "npm run clean & webpack --mode production --no-devtool --config ./config/webpack.web.js"
   },
   "keywords": [
     "artwork",
diff --git a/source/Page/SimulatorWeb/SimulatorWeb.scss b/source/Page/SimulatorWeb/SimulatorWeb.scss
new file mode 100644
index 0000000..e69de29
diff --git a/source/Page/SimulatorWeb/SimulatorWeb.tsx b/source/Page/SimulatorWeb/SimulatorWeb.tsx
new file mode 100644
index 0000000..5f80868
--- /dev/null
+++ b/source/Page/SimulatorWeb/SimulatorWeb.tsx
@@ -0,0 +1,14 @@
+import { Component, ReactNode, createRef } from "react";
+import { Entry } from "../Entry/Entry";
+import "./SimulatorWeb.scss";
+
+class SimulatorWeb extends Component {
+    
+    private canvasContRef = createRef<HTMLDivElement>();
+
+    public render(): ReactNode {
+        return <div>Web</div>
+    }
+}
+
+Entry.renderComponent(SimulatorWeb);
\ No newline at end of file