@pixso/dev-server
Version:
pixso 插件开发 dev server
253 lines (242 loc) • 8.55 kB
JavaScript
var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
// If the importer is in node compatibility mode or this is not an ESM
// file that has been converted to a CommonJS file using a Babel-
// compatible transform (i.e. "__esModule" has not been set), then set
// "default" to the CommonJS "module.exports" for node compatibility.
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/index.ts
var src_exports = {};
__export(src_exports, {
setupDevServer: () => setupDevServer
});
module.exports = __toCommonJS(src_exports);
var import_express2 = __toESM(require("express"));
// src/middleware.ts
var import_express_ws = __toESM(require("express-ws"));
// src/config.ts
var import_hookable = require("hookable");
var import_jiti = __toESM(require("jiti"));
var import_fs = __toESM(require("fs"));
var import_path = __toESM(require("path"));
var isHmr = process.argv[2] === "hmr";
var root = process.cwd();
var resolveModule = (p) => (0, import_jiti.default)(root)(p).default;
var getManifest = () => {
return resolveModule("./manifest.json");
};
var getUIStaticPath = () => {
const { ui } = getManifest();
return import_path.default.resolve(root, ui);
};
var getStaticPath = () => {
const { ui } = getManifest();
return import_path.default.join(ui, "../");
};
var getFile = (p) => {
return import_fs.default.readFileSync(import_path.default.resolve(root, p || ""), "utf8");
};
var pluginDevServicePort = 5201;
var hooks = (0, import_hookable.createHooks)();
// src/watch.ts
var import_chokidar = __toESM(require("chokidar"));
var import_chalk = __toESM(require("chalk"));
// src/utils.ts
var addZero = (val) => {
return val > 9 ? String(val) : `0${val}`;
};
var formatDateToStr = (time, formatStr) => {
const date = /* @__PURE__ */ new Date();
date.setTime(time);
return formatStr.replace(/yyyy|YYYY/, String(date.getFullYear())).replace(/yy|YY/, String(date.getFullYear())).replace(/MM/, addZero(date.getMonth() + 1)).replace(/M/g, String(date.getMonth() + 1)).replace(/dd|DD/, addZero(date.getDate())).replace(/d|D/g, String(date.getDate())).replace(/hh|HH/, addZero(date.getHours())).replace(/h|H/g, String(date.getHours())).replace(/mm/, addZero(date.getMinutes())).replace(/m/g, String(date.getMinutes())).replace(/ss|SS/, addZero(date.getSeconds())).replace(/s|S/g, String(date.getSeconds()));
};
var formatTime = () => formatDateToStr(Date.now(), "YYYY-MM-DD hh:mm:ss");
// src/watch.ts
var watchFile = (path2, callback) => {
return import_chokidar.default.watch(path2).on("add", (path3) => callback("add", path3)).on("change", (path3) => callback("add", path3)).on("unlink", (path3) => callback("add", path3));
};
var uiHtml = `<html>
<head>
<title>pixso plugin debug</title>
<style>
body {
margin: 0;
}
iframe {
height: 100%;
width: 100%;
border: none;
}
</style>
<script>
window.addEventListener("message", (event) => {
const iframeGlobal = document.getElementById('devIframe').contentWindow;
if(event.source === iframeGlobal) {
if(event.data?.pluginDrop && typeof event.data.pluginDrop.relativeToPluginCoordinates !== 'boolean'){
return parent.postMessage({ pluginDrop: Object.assign(event.data.pluginDrop, { relativeToPluginCoordinates: true })}, "*");
}
return parent.postMessage(event.data, "*");
}
return iframeGlobal.postMessage(event.data, "*");
});
const socket = new WebSocket("ws://127.0.0.1:5201/plugin-hmr");
socket.addEventListener("message", () => {
document.getElementById('devIframe').src = "http://localhost:5201?" + Date.now();
});
</script>
</head>
<body><iframe id="devIframe" src="http://localhost:5201"></iframe></body>
</html>`;
var startWatch = () => {
const { main, ui } = getManifest();
let sandbox, host;
if (typeof main === "object") {
sandbox = main.sandbox;
host = main.host;
} else {
sandbox = main;
}
let time0, time1, time2, time3;
watchFile(sandbox, (action, p) => {
console.log(import_chalk.default.green("[plugin-cli]: "), `${action} ${p} ${import_chalk.default.gray(formatTime())}`);
clearTimeout(time0);
time0 = setTimeout(() => {
const mainCode = getFile(sandbox);
hooks.callHook("update", "main", mainCode);
}, 101);
});
if (host) {
watchFile(host, (action, p) => {
console.log(import_chalk.default.green("[plugin-cli]: "), `${action} ${p} ${import_chalk.default.gray(formatTime())}`);
clearTimeout(time1);
time1 = setTimeout(() => {
const hostCode = getFile(host);
hooks.callHook("update", "host", hostCode);
}, 101);
});
}
watchFile(ui, (action, p) => {
console.log(import_chalk.default.green("[plugin-cli]: "), `${action} ${p} ${import_chalk.default.gray(formatTime())}`);
clearTimeout(time2);
time2 = setTimeout(() => {
const uiCode = isHmr ? uiHtml : getFile(ui);
hooks.callHook("update", "ui", uiCode);
}, 101);
});
watchFile("./manifest.json", (action, p) => {
console.log(import_chalk.default.green("[plugin-cli]: "), `${action} ${p} ${import_chalk.default.gray(formatTime())}`);
clearTimeout(time3);
time3 = setTimeout(() => {
const manifest = getFile("./manifest.json");
hooks.callHook("update", "manifest", manifest);
}, 101);
});
};
// src/middleware.ts
var import_express = __toESM(require("express"));
var pool = [];
var hotPool = [];
var messages = /* @__PURE__ */ new Map();
var remove = (ws, list) => {
const idx = list.indexOf(ws);
if (idx === -1)
return;
list.splice(idx, 1);
};
var subUpdate = () => {
return hooks.hook("update", (name, content) => {
const old = messages.get(name);
if (name === "ui" && old && isHmr) {
return hotPool.forEach((socket) => socket.send("reload"));
}
if (old && old === content)
return;
messages.set(name, content);
pool.forEach((socket) => socket.send(JSON.stringify({
name,
content
})));
});
};
var hmr = (eWs) => {
eWs.app.ws("/plugin-hmr", (ws) => {
hotPool.push(ws);
ws.on("error", (err) => {
console.log("hot scoket error", err);
remove(ws, hotPool);
});
ws.on("close", () => {
remove(ws, hotPool);
});
});
};
var pluginScoket = (app) => {
const eWs = (0, import_express_ws.default)(app);
subUpdate();
startWatch();
eWs.app.ws("/plugin", (ws) => {
pool.push(ws);
messages.forEach((content, name) => {
ws.send(JSON.stringify({ name, content }));
});
ws.on("message", (msg) => {
console.log(msg);
});
ws.on("error", (err) => {
console.log("scoket error", err);
remove(ws, pool);
});
ws.on("close", () => {
remove(ws, pool);
});
});
isHmr && hmr(eWs);
return eWs.app;
};
var staticServer = (app) => {
if (!isHmr)
return;
app.use(import_express.default.static(getStaticPath(), {
setHeaders: function(res) {
res.setHeader("Cache-Control", "no-store");
},
index: false
}));
app.get("*", (req, res) => {
res.setHeader("Cache-Control", "no-store");
res.sendFile(getUIStaticPath());
});
};
// src/index.ts
var setupDevServer = (middleware) => {
const app = (0, import_express2.default)();
middleware && middleware(app);
const eWsApp = pluginScoket(app);
eWsApp.listen(pluginDevServicePort);
staticServer(app);
};
setupDevServer();
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
setupDevServer
});