Create backend server

config/webpack.common.js

@@ -70,6 +70,15 @@ const Entry = () => ({
     SimulatorWeb: {
         import: source("./Page/SimulatorWeb/SimulatorWeb.tsx"),
         dependOn: ["Model", "GLRender"]
+    },
+
+    Service: {
+        import: source("./Service/Service.ts")
+    },
+
+    ServiceRunner: {
+        import: source("./Service/Runner.ts"),
+        dependOn: ["Service"]
     }
 });
 

config/webpack.service.js

@@ -0,0 +1,41 @@
+const { Entry, Output, resolve, TypeScriptRules } = require("./webpack.common");
+
+const AllEntry = Entry();
+
+module.exports = (env) => {
+    
+    const config = {
+
+        entry: {
+            Service: AllEntry.Service,
+			ServiceRunner: AllEntry.ServiceRunner,
+        },
+
+        output: Output("[name].js"),
+        devtool: 'source-map',
+        mode: "development",
+        resolve: resolve(),
+
+        optimization: {
+            splitChunks: {
+                chunks: 'all',
+                minSize: 1000
+            }
+        },
+
+        module: {
+            rules: [
+                TypeScriptRules()
+            ]
+        },
+
+		node: {
+			__filename: false,
+			__dirname: false
+		},
+
+		target: 'node'
+    };
+
+    return config;
+};

package.json

@@ -10,7 +10,12 @@
     "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"
+    "release-web": "npm run clean & webpack --mode production --no-devtool --config ./config/webpack.web.js",
+    "build-service": "webpack --mode development --config ./config/webpack.service.js",
+    "release-service": "webpack --mode production --no-devtool --config ./config/webpack.service.js",
+    "run-service": "node ./build/ServiceRunner.js --run --path ./build --port 12000",
+    "build-run-web": "npm run build-web & npm run build-service & npm run run-service",
+    "release-run-web": "npm run release-web & npm run release-service & npm run run-service"
   },
   "keywords": [
     "artwork",
@@ -21,6 +26,7 @@
   "author": "MrKBear",
   "license": "GPL",
   "devDependencies": {
+    "@types/detect-port": "^1.3.2",
     "@types/react": "^17.0.38",
     "@types/react-dom": "^17.0.11",
     "autoprefixer": "^10.4.2",
@@ -41,6 +47,8 @@
   "dependencies": {
     "@fluentui/react": "^8.56.0",
     "@juggle/resize-observer": "^3.3.1",
+    "detect-port": "^1.3.0",
+    "express": "^4.17.3",
     "gl-matrix": "^3.4.3",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"

source/Service/Runner.ts

@@ -0,0 +1,8 @@
+import { Service } from "@Service/Service";
+import * as minimist from "minimist";
+
+const args = minimist(process.argv.slice(2));
+
+if (args.run) {
+	new Service().run(args.path, args.port);
+}

source/Service/Service.ts

@@ -0,0 +1,47 @@
+import { Express } from "express";
+import * as express from "express";
+import * as detect from "detect-port";
+
+class Service {
+
+	/**
+	 * 默认端口
+	 */
+	public servicePort: number = 12100;
+
+	/**
+	 * Express 实例
+	 */
+	public app!: Express;
+
+	/**
+	 * 获取空闲接口
+	 */
+	private async getFreePort(): Promise<number> {
+
+		let freePort: number = this.servicePort;
+		
+		try {
+			freePort = await detect(this.servicePort);
+		} catch (err) {
+			console.log(err);
+		}
+
+		return freePort;
+	}
+
+	public async run(url?: string, port?: number) {
+
+		this.servicePort = port ?? await this.getFreePort();
+
+		this.app = express();
+
+		this.app.use("/", express.static(url ?? "./"));
+
+		this.app.listen(this.servicePort);
+
+		console.log("Service: service run in port " + this.servicePort);
+	}
+}
+
+export { Service };

tsconfig.json

@@ -40,6 +40,9 @@
             ],
             "@Panel/*": [
                 "./source/Panel/*"
+            ],
+            "@Service/*": [
+                "./source/Service/*"
             ]
         }
     },