feat: hot restart (#2153)

* feat: hot restart

* fix: formatting

* Update utils/scripts/dev.js

Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>

* Update utils/scripts/dev.js

Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>

* fix: issues

* fix: formatting

* fix: issues

---------

Co-authored-by: Ajit Kumar <dellevenjack@gmail>
Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>

Author: 3 people

.gitignore

@@ -19,3 +19,5 @@ graphify-out/
 .gradle/
 local.properties
 tsconfig.tsbuildinfo
+.dev-cert.pem
+.dev-key.pem

package-lock.json

@@ -7,6 +7,8 @@
     "lang": "node ./utils/lang.js",
     "build": "sh utils/scripts/build.sh",
     "start": "sh utils/scripts/start.sh",
+    "dev": "node utils/scripts/dev.js",
+    "dev:android": "node utils/scripts/dev.js android",
     "clean": "sh utils/scripts/clean.sh android android",
     "plugin": "sh utils/scripts/plugin.sh",
     "setup": "node ./utils/setup.js",
@@ -74,6 +76,7 @@
     "@types/url-parse": "^1.4.11",
     "autoprefixer": "^10.5.0",
     "babel-loader": "^10.1.1",
+    "chokidar": "^4.0.3",
     "com.foxdebug.acode.rk.auth": "file:src/plugins/auth",
     "com.foxdebug.acode.rk.customtabs": "file:src/plugins/custom-tabs",
     "com.foxdebug.acode.rk.exec.proot": "file:src/plugins/proot",
@@ -106,7 +109,8 @@
     "terminal": "^0.1.4",
     "ts-loader": "^9.5.7",
     "typescript": "^5.9.3",
-    "vscode-languageserver-types": "^3.17.5"
+    "vscode-languageserver-types": "^3.17.5",
+    "ws": "^8.21.0"
   },
   "dependencies": {
     "@codemirror/autocomplete": "^6.20.2",

package.json

@@ -4,6 +4,13 @@ const { rspack } = require('@rspack/core');
 module.exports = (env, options) => {
   const { mode = 'development' } = options;
   const prod = mode === 'production';
+  const isDev = process.env.DEV_MODE === 'true';
+  const devHost = process.env.DEV_HOST || '';
+  const devPort = process.env.DEV_PORT || '';
+  const devProto = isDev ? (process.env.DEV_PROTO || '') : '';
+  const devOrigin = isDev && devHost && devPort && devProto
+    ? ''.concat(devProto, '://', devHost, ':', devPort)
+    : '';
 
   const rules = [
     // TypeScript/TSX files - Custom JSX loader + SWC
@@ -113,6 +120,7 @@ module.exports = (env, options) => {
   const main = {
     mode,
     entry: {
+      boot: './src/boot.js',
       main: './src/main.js',
       console: './src/lib/console.js',
       searchInFilesWorker: './src/sidebarApps/searchInFiles/worker.js',
@@ -122,8 +130,8 @@ module.exports = (env, options) => {
       filename: '[name].js',
       chunkFilename: '[name].chunk.js',
       assetModuleFilename: '[name][ext]',
-      publicPath: '/build/',
-      clean: true,
+      publicPath: devOrigin ? ''.concat(devOrigin, '/build/') : '/build/',
+      clean: !isDev,
     },
     module: {
       rules,
@@ -144,6 +152,12 @@ module.exports = (env, options) => {
       roots: [],
     },
     plugins: [
+      new rspack.DefinePlugin({
+        __DEV_MODE__: JSON.stringify(isDev),
+        __DEV_HOST__: JSON.stringify(devHost),
+        __DEV_PORT__: JSON.stringify(devPort),
+        __DEV_PROTO__: JSON.stringify(devProto),
+      }),
       new rspack.CssExtractRspackPlugin({
         filename: '[name].css',
       }),

rspack.config.js

@@ -0,0 +1,67 @@
+// boot.js — Entry point loaded by index.html
+// Routes between development (HTTP dev server) and production (local assets).
+// main.js is never imported directly; it's loaded dynamically so the dev server
+// can serve a freshly compiled version on every reload.
+
+(function boot() {
+	"use strict";
+
+	var DEV_MODE = typeof __DEV_MODE__ !== "undefined" && __DEV_MODE__;
+	var DEV_HOST = typeof __DEV_HOST__ !== "undefined" ? __DEV_HOST__ : "";
+	var DEV_PORT = typeof __DEV_PORT__ !== "undefined" ? __DEV_PORT__ : "";
+	var DEV_PROTO = typeof __DEV_PROTO__ !== "undefined" ? __DEV_PROTO__ : "";
+	var DEV_ORIGIN =
+		DEV_HOST && DEV_PORT && DEV_PROTO
+			? DEV_PROTO.concat("://", DEV_HOST, ":", DEV_PORT)
+			: "";
+
+	function loadScript(src) {
+		var script = document.createElement("script");
+		script.src = src;
+		document.head.appendChild(script);
+	}
+
+	function loadCSS(href) {
+		var link = document.createElement("link");
+		link.rel = "stylesheet";
+		link.href = href;
+		document.head.appendChild(link);
+	}
+
+	if (DEV_MODE && DEV_ORIGIN) {
+		// --- Development mode: load everything from the dev server ---
+		loadCSS("".concat(DEV_ORIGIN, "/build/main.css"));
+		loadScript("".concat(DEV_ORIGIN, "/build/main.js"));
+
+		// WebSocket reload channel
+		(function connectWS() {
+			var wsProto = DEV_PROTO === "https" ? "wss" : "ws";
+			var ws;
+
+			try {
+				ws = new WebSocket("".concat(wsProto, "://", DEV_HOST, ":", DEV_PORT));
+			} catch (_e) {
+				setTimeout(connectWS, 1000);
+				return;
+			}
+
+			ws.onmessage = function (e) {
+				if (e.data === "reload") {
+					window.location.reload();
+				}
+			};
+
+			ws.onclose = function () {
+				setTimeout(connectWS, 1000);
+			};
+
+			ws.onerror = function () {
+				// Will trigger onclose and retry
+			};
+		})();
+	} else {
+		// --- Production / fallback: load local bundle ---
+		loadCSS("./build/main.css");
+		loadScript("./build/main.js");
+	}
+})();