oipage 1.3.0-alpha.2 → 1.3.0

package/CHANGELOG

@@ -1,64 +1,69 @@
-v1.0.0:
-    date:2025-02-13
-    changes:
-      - 原v0.x的功能将独立一个分支继续维护：https://github.com/oi-contrib/OIPage/blob/v0.x/CHANGELOG
-        （v0.x保持对零碎方法这种形式的支持和维护，此版本开始将作为一个框架或一个系统的工具箱以提供更高效的使用方式，这是一次彻底的非兼容改造）
-      - 初始化版本（v1.x）
-        1、API功能（浏览器）
-          * animation 动画
-          * getStyle 获取节点样式
-          * setStyle 设置节点样式
-          * onReady 加载完毕执行
-          * throttle 节流函数
-        2、API功能（Node.js）
-          * animation 动画
-          * deeplog 进度打印
-          * linglog 单行打印
-          * throttle 节流函数
-        3、命令（oipage-cli）
-          * serve 开发服务器
-v1.1.0:
-    date:2025-02-18
-    changes:
-      - 修复bug
-        1、通过路径类型判断以修复开发服务器无法设置绝对路径问题
-      - 优化改造
-        1、使用流读取以使开发服务器支持大文件下载
-          （同时添加下载进度可查）
-      - 新增功能
-        1、API功能（Node.js）
-          * disk 磁盘相关操作
-            （包括：deleteDisk、copyDisk）
-          * logform 表单输入
-        2、命令（oipage-cli）
-          * dist 磁盘操作
-          * run 运行多命令
-v1.2.0:
-    date:2025-02-25
-    changes:
-      - 优化改造
-        1、优化npm包目录结构等
-      - 新增功能
-        1、开发服务器
-          * 添加配置文件
-            （oipage-cli serve --config ./oipage.config.js）
-          * 新增对node_modules包引入支持
-v1.2.1:
-    date:2025-03-06
-    changes:
-      - 修复bug
-        1、开发服务器
-          * 修复路径不存在时未正确同步修改浏览器地址问题
-v1.3.0:
-    date:
-    changes:
-      - 修复bug
-        1、开发服务器
-          * 修复服务器根路径判断错误导致node_modules包查找错误问题
-      - 新增功能
-        1、API功能（浏览器）
-          * reader 文本分析读取器
-        2、API功能（Node.js）
-          * reader 文本分析读取器
-        3、开发服务器
-          * 新增 devServer.intercept 请求拦截
+v1.0.0:
+    date:2025-02-13
+    changes:
+      - 原v0.x的功能将独立一个分支继续维护：https://github.com/oi-contrib/OIPage/blob/v0.x/CHANGELOG
+        （v0.x保持对零碎方法这种形式的支持和维护，此版本开始将作为一个框架或一个系统的工具箱以提供更高效的使用方式，这是一次彻底的非兼容改造）
+      - 初始化版本（v1.x）
+        1、API功能（浏览器）
+          * animation 动画
+          * getStyle 获取节点样式
+          * setStyle 设置节点样式
+          * onReady 加载完毕执行
+          * throttle 节流函数
+        2、API功能（Node.js）
+          * animation 动画
+          * deeplog 进度打印
+          * linglog 单行打印
+          * throttle 节流函数
+        3、命令（oipage-cli）
+          * serve 开发服务器
+v1.1.0:
+    date:2025-02-18
+    changes:
+      - 修复bug
+        1、通过路径类型判断以修复开发服务器无法设置绝对路径问题
+      - 优化改造
+        1、使用流读取以使开发服务器支持大文件下载
+          （同时添加下载进度可查）
+      - 新增功能
+        1、API功能（Node.js）
+          * disk 磁盘相关操作
+            （包括：deleteDisk、copyDisk）
+          * logform 表单输入
+        2、命令（oipage-cli）
+          * dist 磁盘操作
+          * run 运行多命令
+v1.2.0:
+    date:2025-02-25
+    changes:
+      - 优化改造
+        1、优化npm包目录结构等
+      - 新增功能
+        1、开发服务器
+          * 添加配置文件
+            （oipage-cli serve --config ./oipage.config.js）
+          * 新增对node_modules包引入支持
+v1.2.1:
+    date:2025-03-06
+    changes:
+      - 修复bug
+        1、开发服务器
+          * 修复路径不存在时未正确同步修改浏览器地址问题
+v1.3.0:
+    date:2025-05-18
+    changes:
+      - 修复bug
+        1、开发服务器
+          * 修复服务器根路径判断错误导致node_modules包查找错误问题
+        2、修复animation动画types类型定义错误问题
+      - 新增功能
+        1、API功能（浏览器）
+          * reader 文本分析读取器
+          * performChunk 空闲执行分片函数
+          * strToJson JSON字符串解析
+        2、API功能（Node.js）
+          * reader 文本分析读取器
+          * strToJson JSON字符串解析
+        3、开发服务器
+          * 新增 devServer.intercept 请求拦截
+          * 新增对 if-modified-since和last-modified 之304协商缓存的支持

package/bin/intercept.js

@@ -1,16 +1,16 @@
-exports.doIntercept = function (url, intercept, request, response) {
-    for (let item of intercept) {
-        if (item.test.test(url)) {
-            item.handler(request, response);
-            return true;
-        }
-    }
-}
-
-exports.testIntercept = function (url, intercept) {
-    for (let item of intercept) {
-        if (item.test.test(url)) {
-            return true;
-        }
-    }
+exports.doIntercept = function (url, intercept, request, response) {
+    for (let item of intercept) {
+        if (item.test.test(url)) {
+            item.handler(request, response);
+            return true;
+        }
+    }
+}
+
+exports.testIntercept = function (url, intercept) {
+    for (let item of intercept) {
+        if (item.test.test(url)) {
+            return true;
+        }
+    }
 }

package/bin/run

@@ -1,97 +1,97 @@
-#!/usr/bin/env node
-
-'use strict';
-
-process.title = 'OIPage';
-
-const { exec } = require('child_process');
-const { join } = require("path");
-const { existsSync, lstatSync } = require("fs");
-const { mergeOption } = require("vislite");
-const { formatArgv } = require("./tools/format.js");
-
-// 开发服务器
-if (process.argv[2] === "serve") {
-
-    let argvObj = formatArgv(process.argv, {
-        "-p": "--port",
-        "-c": "--config"
-    });
-
-    let config = {
-        devServer: {
-            port: 8080,
-            baseUrl: "./",
-            intercept: []
-        },
-        module: {
-            rules: []
-        }
-    };
-
-    // 如果设置了配置文件
-    if (argvObj["--config"]) {
-        let configPath = join(process.cwd(), argvObj["--config"][0] || "./oipage.config.js");
-        if (existsSync(configPath) && !lstatSync(configPath).isDirectory()) {
-            let configValue = require(configPath);
-            mergeOption(config, configValue);
-        } else {
-            console.log("\x1b[0m\x1b[31m" + configPath + "\x1b[0m");
-            throw new Error("OIPage: The configuration file does not exist or is not a file.");
-        }
-    }
-
-    if ((argvObj["--port"] || [])[0]) config.devServer.port = (argvObj["--port"] || [])[0];
-    if ((argvObj["--baseUrl"] || [])[0]) config.devServer.baseUrl = (argvObj["--baseUrl"] || [])[0];
-
-    require("./serve.js")(config);
-}
-
-// 磁盘操作
-else if (process.argv[2] === "disk") {
-
-    let argvObj = formatArgv(process.argv, {
-        "-f": "--force",
-        "-d": "--delete",
-        "-m": "--move",
-        "-c": "--copy"
-    }, true);
-
-    require("./disk.js")(argvObj);
-}
-
-// 运行多命令
-else if (process.argv[2] === "run") {
-
-    let argvObj = formatArgv(process.argv, {});
-
-    for (let index = 0; index < argvObj.args.length; index++) {
-        const child = exec(argvObj.args[index]);
-
-        // 监听子线程的stdout
-        child.stdout.on('data', (data) => {
-            console.log(`[${index + 1}] log:${data}`);
-        });
-
-        // 监听子线程的stderr
-        child.stderr.on('data', (data) => {
-            console.error(`[${index + 1}] error:${data}`);
-        });
-
-        // 子线程结束处理
-        child.on('close', (code) => {
-            console.log(`[${index + 1}] 子线程结束，退出码 ${code}`);
-        });
-
-        // 子线程出错处理
-        child.on('error', (error) => {
-            console.error(`[${index + 1}] 子线程错误: ${error.message}`);
-        });
-    }
-
-}
-
-// 默认，帮助
-else {
-    require("./help.js")();
+#!/usr/bin/env node
+
+'use strict';
+
+process.title = 'OIPage';
+
+const { exec } = require('child_process');
+const { join } = require("path");
+const { existsSync, lstatSync } = require("fs");
+const { mergeOption } = require("vislite");
+const { formatArgv } = require("./tools/format.js");
+
+// 开发服务器
+if (process.argv[2] === "serve") {
+
+    let argvObj = formatArgv(process.argv, {
+        "-p": "--port",
+        "-c": "--config"
+    });
+
+    let config = {
+        devServer: {
+            port: 8080,
+            baseUrl: "./",
+            intercept: []
+        },
+        module: {
+            rules: []
+        }
+    };
+
+    // 如果设置了配置文件
+    if (argvObj["--config"]) {
+        let configPath = join(process.cwd(), argvObj["--config"][0] || "./oipage.config.js");
+        if (existsSync(configPath) && !lstatSync(configPath).isDirectory()) {
+            let configValue = require(configPath);
+            mergeOption(config, configValue);
+        } else {
+            console.log("\x1b[0m\x1b[31m" + configPath + "\x1b[0m");
+            throw new Error("OIPage: The configuration file does not exist or is not a file.");
+        }
+    }
+
+    if ((argvObj["--port"] || [])[0]) config.devServer.port = (argvObj["--port"] || [])[0];
+    if ((argvObj["--baseUrl"] || [])[0]) config.devServer.baseUrl = (argvObj["--baseUrl"] || [])[0];
+
+    require("./serve.js")(config);
+}
+
+// 磁盘操作
+else if (process.argv[2] === "disk") {
+
+    let argvObj = formatArgv(process.argv, {
+        "-f": "--force",
+        "-d": "--delete",
+        "-m": "--move",
+        "-c": "--copy"
+    }, true);
+
+    require("./disk.js")(argvObj);
+}
+
+// 运行多命令
+else if (process.argv[2] === "run") {
+
+    let argvObj = formatArgv(process.argv, {});
+
+    for (let index = 0; index < argvObj.args.length; index++) {
+        const child = exec(argvObj.args[index]);
+
+        // 监听子线程的stdout
+        child.stdout.on('data', (data) => {
+            console.log(`[${index + 1}] log:${data}`);
+        });
+
+        // 监听子线程的stderr
+        child.stderr.on('data', (data) => {
+            console.error(`[${index + 1}] error:${data}`);
+        });
+
+        // 子线程结束处理
+        child.on('close', (code) => {
+            console.log(`[${index + 1}] 子线程结束，退出码 ${code}`);
+        });
+
+        // 子线程出错处理
+        child.on('error', (error) => {
+            console.error(`[${index + 1}] 子线程错误: ${error.message}`);
+        });
+    }
+
+}
+
+// 默认，帮助
+else {
+    require("./help.js")();
 }

package/bin/serve.js

@@ -1,115 +1,129 @@
-const { join } = require("path");
-const { existsSync, lstatSync, statSync, createReadStream } = require("fs");
-const { createServer } = require('http');
-const packageValue = require("../package.json");
-const network = require("./tools/network.js");
-const mineTypes = require("./data/mineTypes.json");
-const resolve404 = require("./tools/resolve404.js");
-const resolveImportFactory = require("./tools/resolveImport.js");
-const { formatRawHeaders } = require("./tools/format.js");
-const { doIntercept } = require("./intercept.js");
-
-// 开发服务器
-module.exports = function (config) {
-    let startTime = new Date().valueOf();
-
-    const port = config.devServer.port; // 端口号
-    const basePath = (/^\./.test(config.devServer.baseUrl)) ? join(process.cwd(), config.devServer.baseUrl) : config.devServer.baseUrl; // 服务器根路径
-
-    let Server = createServer(function (request, response) {
-        let headers = formatRawHeaders(request.rawHeaders);
-        let url = decodeURIComponent(request.url);
-
-        let urlArray = url.split("?");
-        url = urlArray[0];
-
-        // 请求的文件路径
-        let filePath = join(basePath, url == "/" ? "index.html" : url.replace(/^\//, ""));
-
-        // 请求拦截
-        if (doIntercept(url.replace(/^\/@modules\//, ""), config.devServer.intercept, request, response)) {
-            console.log("<i> \x1b[1m\x1b[32m[OIPage-dev-server] intercept: " + url + '\x1b[0m ' + new Date().toLocaleString());
-        }
-
-        // 如果存在且是文件
-        else if (existsSync(filePath) && !lstatSync(filePath).isDirectory()) {
-
-            let dotName = /\./.test(filePath) ? filePath.match(/\.([^.]+)$/)[1] : "";
-            let fileType = mineTypes[dotName]; // 文件类型
-            let fileInfo = statSync(filePath);
-
-            let responseHeader = {
-                'Content-type': (fileType || "text/plain") + ";charset=utf-8",
-                'Access-Control-Allow-Origin': '*',
-                'Server': 'Powered by OIPage-dev-server@' + packageValue.version
-            };
-
-            let sendType = "";
-            let entry = headers.Accept !== "*/*";
-
-            // 如果文件小于10M，认为不大，直接读取
-            if (fileInfo.size < 10 * 1024 * 1024) {
-                let { source, resolveImport } = resolveImportFactory(basePath, filePath, entry, config.devServer.intercept, urlArray[1] === "download")
-
-                // 只处理非下载文件
-                // 过大的也不进行处理
-                if (urlArray[1] !== "download") {
-                    for (let i = 0; i < config.module.rules.length; i++) {
-                        if (config.module.rules[i].test.test(filePath)) {
-                            source = config.module.rules[i].use.call({
-                                root: basePath, // 服务器根路径
-                                path: filePath.replace(basePath, ""), // 文件相对路径
-                                entry, // 是否是浏览器地址栏直接访问
-                                setFileType(_fileType) { // 设置文件类型
-                                    fileType = _fileType;
-                                    responseHeader['Content-type'] = _fileType + ";charset=utf-8";
-                                }
-                            }, source);
-                            break;
-                        }
-                    }
-                }
-
-                sendType = "Read";
-                response.writeHead('200', responseHeader);
-                response.write(resolveImport(source, fileType !== "application/javascript"));
-                response.end();
-            }
-
-            // 对于大文件，使用流读取
-            else {
-                sendType = "Stream";
-                responseHeader["Content-Length"] = fileInfo.size;
-                response.writeHead('200', responseHeader);
-                createReadStream(filePath).pipe(response);
-            }
-
-            console.log("<i> \x1b[1m\x1b[32m[OIPage-dev-server] " + sendType + " File: " + url + '\x1b[0m ' + new Date().toLocaleString());
-        }
-
-        // 否则就是404
-        else {
-            response.writeHead(404, {
-                'Content-type': "text/html;charset=utf-8",
-                'Access-Control-Allow-Origin': '*',
-                'Server': 'Powered by OIPage-dev-server@' + packageValue.version
-            });
-            response.write(resolve404(filePath, url));
-            response.end();
-        }
-
-    });
-
-    Server.listen(port);
-
-    // 获取网络信息
-    let networkValue = network();
-
-    // 打印成功提示
-    console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] Project is running at:\x1b[0m');
-    console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] Loopback: \x1b[36mhttp://localhost:' + port + '/\x1b[0m');
-    for (let ipv4Item of networkValue.IPv4) console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] On Your Network (IPv4):\x1b[36m http://' + ipv4Item.address + ':' + port + '/\x1b[0m');
-    for (let ipv6Item of networkValue.IPv6) console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] On Your Network (IPv6): \x1b[36mhttp://[' + ipv6Item.address + ']:' + port + '/\x1b[0m');
-    console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] Content not from OIPage is served from \x1b[36m"' + basePath + '" \x1b[0mdirectory');
-    console.log('\nOIPage ' + packageValue.version + ' compiled \x1b[1m\x1b[32msuccessfully\x1b[0m in ' + (new Date().valueOf() - startTime) + ' ms\n')
+const { join } = require("path");
+const { existsSync, lstatSync, statSync, createReadStream } = require("fs");
+const { createServer } = require('http');
+const packageValue = require("../package.json");
+const network = require("./tools/network.js");
+const mineTypes = require("./data/mineTypes.json");
+const resolve404 = require("./tools/resolve404.js");
+const resolveImportFactory = require("./tools/resolveImport.js");
+const { doIntercept } = require("./intercept.js");
+
+// 开发服务器
+module.exports = function (config) {
+    let startTime = new Date().valueOf();
+
+    const port = config.devServer.port; // 端口号
+    const basePath = (/^\./.test(config.devServer.baseUrl)) ? join(process.cwd(), config.devServer.baseUrl) : config.devServer.baseUrl; // 服务器根路径
+
+    let Server = createServer(function (request, response) {
+        let headers = request.headers;
+        let url = decodeURIComponent(request.url);
+
+        let urlArray = url.split("?");
+        url = urlArray[0];
+
+        // 请求的文件路径
+        let filePath = join(basePath, url == "/" ? "index.html" : url.replace(/^\//, ""));
+
+        // 请求拦截
+        if (doIntercept(url.replace(/^\/@modules\//, ""), config.devServer.intercept, request, response)) {
+            console.log("<i> \x1b[1m\x1b[32m[OIPage-dev-server] intercept: " + url + '\x1b[0m ' + new Date().toLocaleString());
+        }
+
+        // 如果存在且是文件
+        else if (existsSync(filePath) && !lstatSync(filePath).isDirectory()) {
+
+            let dotName = /\./.test(filePath) ? filePath.match(/\.([^.]+)$/)[1] : "";
+            let fileType = mineTypes[dotName]; // 文件类型
+            let fileInfo = statSync(filePath);
+
+            let fileModifiedTime = new Date(fileInfo.mtime).toString();
+
+            let responseHeader = {
+                'Content-type': (fileType || "text/plain") + ";charset=utf-8",
+                'Access-Control-Allow-Origin': '*',
+                'Server': 'Powered by OIPage-dev-server@' + packageValue.version,
+                'Cache-Control': 'no-cache',
+                'Last-Modified': fileModifiedTime
+            };
+
+            if (headers["if-modified-since"]) {
+                let ifModifiedSince = new Date(headers["if-modified-since"]).valueOf()
+                let lastModified = new Date(fileModifiedTime).valueOf()
+                if (lastModified <= ifModifiedSince) {
+                    response.writeHead('304', responseHeader);
+                    response.end();
+                    console.log("<i> \x1b[1m\x1b[32m[OIPage-dev-server] Cache File: " + url + "\x1b[0m " + new Date().toLocaleString() + "\x1b[33m\x1b[1m 304\x1b[0m");
+                    return;
+                }
+            }
+
+            let sendType = "";
+            let entry = headers.Accept !== "*/*";
+
+            // 如果文件小于10M，认为不大，直接读取
+            if (fileInfo.size < 10 * 1024 * 1024) {
+                let { source, resolveImport } = resolveImportFactory(basePath, filePath, entry, config.devServer.intercept, urlArray[1] === "download")
+
+                // 只处理非下载文件
+                // 过大的也不进行处理
+                if (urlArray[1] !== "download") {
+                    for (let i = 0; i < config.module.rules.length; i++) {
+                        if (config.module.rules[i].test.test(filePath)) {
+                            source = config.module.rules[i].use.call({
+                                root: basePath, // 服务器根路径
+                                path: filePath.replace(basePath, ""), // 文件相对路径
+                                entry, // 是否是浏览器地址栏直接访问
+                                setFileType(_fileType) { // 设置文件类型
+                                    fileType = _fileType;
+                                    responseHeader['Content-type'] = _fileType + ";charset=utf-8";
+                                }
+                            }, source);
+                            break;
+                        }
+                    }
+                }
+
+                sendType = "Read";
+                response.writeHead('200', responseHeader);
+                response.write(resolveImport(source, fileType !== "application/javascript"));
+                response.end();
+            }
+
+            // 对于大文件，使用流读取
+            else {
+                sendType = "Stream";
+                responseHeader["Content-Length"] = fileInfo.size;
+                response.writeHead('200', responseHeader);
+                createReadStream(filePath).pipe(response);
+            }
+
+            console.log("<i> \x1b[1m\x1b[32m[OIPage-dev-server] " + sendType + " File: " + url + '\x1b[0m ' + new Date().toLocaleString());
+        }
+
+        // 否则就是404
+        else {
+            response.writeHead(404, {
+                'Content-type': "text/html;charset=utf-8",
+                'Access-Control-Allow-Origin': '*',
+                'Server': 'Powered by OIPage-dev-server@' + packageValue.version
+            });
+            response.write(resolve404(filePath, url));
+            response.end();
+        }
+
+    });
+
+    Server.listen(port);
+
+    // 获取网络信息
+    let networkValue = network();
+
+    // 打印成功提示
+    console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] Project is running at:\x1b[0m');
+    console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] Loopback: \x1b[36mhttp://localhost:' + port + '/\x1b[0m');
+    for (let ipv4Item of networkValue.IPv4) console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] On Your Network (IPv4):\x1b[36m http://' + ipv4Item.address + ':' + port + '/\x1b[0m');
+    for (let ipv6Item of networkValue.IPv6) console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] On Your Network (IPv6): \x1b[36mhttp://[' + ipv6Item.address + ']:' + port + '/\x1b[0m');
+    console.log('<i> \x1b[1m\x1b[32m[OIPage-dev-server] Content not from OIPage is served from \x1b[36m"' + basePath + '" \x1b[0mdirectory');
+    console.log('\nOIPage ' + packageValue.version + ' compiled \x1b[1m\x1b[32msuccessfully\x1b[0m in ' + (new Date().valueOf() - startTime) + ' ms\n')
 };