wildpig 1.0.11 → 1.0.13

package/router/MetaGuard.tsx

@@ -0,0 +1,38 @@
+import { getBrowserEnvironment } from "../utils/client/environment";
+import { createBrowserRouter } from "react-router";
+// 为了获取type而创建的router
+const browserRouterForType = createBrowserRouter([
+    {
+        path: "/just-for-type",
+        Component: null,
+    }
+]);
+export type BrowserRouter = typeof browserRouterForType;
+
+
+/**
+ * 获取meta信息
+ * @param url like "/home?a=1"
+ */
+const refreshMeta = (url: string) =>{
+    console.log("get url:", url);
+    fetch("/_WILDPIG_META_API" + url).then(res => res.json()).then(({title}) => {
+        document.title = title;
+    });
+}
+
+export const RouterMetaGuard = (browserRouter: BrowserRouter): BrowserRouter => {
+    
+    // 检查meta，判断是否是dev环境
+    const isDev = getBrowserEnvironment() === "development";
+    if(isDev){
+        // 开发环境首次执行，生产阶段为了seo，无需首次执行
+        refreshMeta(window.location.pathname + window.location.search);
+    }
+    
+    // 每次跳转都会触发，包括 <Link>/navigate/前进后退
+    browserRouter.subscribe(({ location }) => {
+        refreshMeta(location.pathname + location.search);
+    });
+    return browserRouter;
+}

package/scripts/WildPig.ts

@@ -2,8 +2,10 @@ import chalk from "chalk";
 import { htmlString } from "./htmlString";
 import { routes, metaRoutes } from "./prepareRoutes";
 import { readFileSync } from "node:fs";
+import devIndexHtml from "#/public/devIndex.html"
 
 const env = process.env;
+const isDev = env.NODE_ENV === "development";
 
 
 export const startServer = () => {
@@ -21,10 +23,11 @@ export const startServer = () => {
             "/render.js": () => new Response((readFileSync("./public/render.js.br")), {
                 headers: {
                     "Content-Encoding": "br",
-                    "content-type": "text/javascript; charset=utf-8",
+                    "Content-Type": "text/javascript; charset=utf-8",
+                    "Cache-Control": isDev ? "no-cache" : "public, max-age=31536000, immutable"
                 }
             }),
-            "/*": async (request) => {
+            "/*": isDev ? devIndexHtml : async (request) => {
                 const url = "/" + (request.url.split("/")[3] || "");
                 // console.log("url:", url);
                 const pathname = "/_WILDPIG_META_API" + url.split("?")[0];
@@ -42,7 +45,7 @@ export const startServer = () => {
                 })
             },
         },
-        development: false,
+        development: isDev
     })
     console.clear();
 console.log(` __        __ _  _      _   ____   _        
@@ -51,8 +54,13 @@ console.log(` __        __ _  _      _   ____   _
    \\ V  V /  | || || (_| | |  __/ | || (_| |
     \\_/\\_/   |_||_| \\__,_| |_|    |_| \\__, |
                                       |___/ `)
-    console.log(chalk.blue.bgGreen("         🐗 WildPig version 1.0.0 by eriktse       "));
+    console.log(chalk.blue.bgGreen("         🐗 WildPig version 1.0.11 by eriktse       "));
     console.log(chalk.green("          Strong & Fast Fullstack Framework\n"));
     console.log(chalk.green("✨ WildPig is running on port " + env.PORT || 3000));
+    if(isDev){
+        console.log(chalk.yellow("💻 Wildpig is Running in development mode."));
+    }else{
+        console.log(chalk.green("💻 Wildpig is Running in production mode."));
+    }
     console.log(chalk.green("🔗 Click to debug in Browser: http://localhost" + ":" + (env.PORT || 3000)));
 }

package/scripts/packageStatic.ts

@@ -1,6 +1,6 @@
 import Bun from "bun";
 import fs, { readFileSync, writeFileSync } from "node:fs";
-import { brotliCompressSync } from "node:zlib";
+import { brotliCompressSync, constants } from "node:zlib";
 
 
 export const packageStatic = async () => {
@@ -12,7 +12,16 @@ export const packageStatic = async () => {
         minify: true,
     });
     // 将 ./public/render.js 转为 ./public/render.br
-    writeFileSync("./dist/public/render.js.br", brotliCompressSync(Buffer.from(readFileSync("./dist/public/render.js"))));
+    writeFileSync("./dist/public/render.js.br", brotliCompressSync(
+        Buffer.from(readFileSync("./dist/public/render.js")),
+        {
+            params: {
+                [constants.BROTLI_PARAM_QUALITY]:  11,   // 最高质量
+                [constants.BROTLI_PARAM_LGWIN]:    16,   // 最大窗口 16 MB
+                [constants.BROTLI_PARAM_MODE]:     constants.BROTLI_MODE_TEXT, // 针对文本优化
+            }
+        }
+    ));
 
     /** 打包ico */
     fs.copyFileSync("./public/favicon.ico", "./dist/public/favicon.ico");

package/scripts/prepareRoutes.ts

@@ -16,8 +16,8 @@ if(isDev){
     await Bun.build({
         entrypoints: ["./public/render.tsx"],
         outdir: "./public",
-        format: "iife",
-        minify: true,
+        format: "esm",
+        sourcemap: true,
     });
     // 将 ./public/render.js 转为 ./public/render.br
     writeFileSync("./public/render.js.br", brotliCompressSync(Buffer.from(readFileSync("./public/render.js"))));

package/test.ts

@@ -0,0 +1,3 @@
+import { startServer } from "./scripts/WildPig";
+
+startServer();

package/utils/client/environment.ts

@@ -0,0 +1,17 @@
+
+
+
+export const getBrowserEnvironment = () => {
+    const metaTags = document.head.getElementsByTagName("meta");
+    if(!metaTags || metaTags.length === 0)
+        return "production";
+    // 如果某个meta标签的name属性为wildpig-environment，且content属性为development，则返回development
+    if(Array.from(metaTags).some(metaTag => 
+        metaTag.getAttribute("name") === "wildpig-environment"
+        && metaTag.getAttribute("content") === "development"
+    )){
+        return "development";
+    }
+
+    return "production";
+}

package/src/App.tsx

@@ -1,7 +0,0 @@
-import { RouterProvider } from "react-router";
-import { browserRouter } from "./router";
-import { RouterGuard } from "./router/guard";
-RouterGuard(browserRouter);
-
-
-export const App = () => <RouterProvider router={browserRouter} />;

package/src/api/hello/index.ts

@@ -1,16 +0,0 @@
-
-
-
-
-export const GET = (req: Request) => {
-    return Response.json({
-        message: "hello get",
-    })
-}
-
-
-export const POST = async (req: Request) => {
-    return Response.json({
-        message: "hello post",
-    })
-}

package/src/middleware.ts

@@ -1,13 +0,0 @@
-
-
-
-
-
-export const middleware = async (req: Request, next: (req: Request) => Promise<Response>) => {
-    console.log("middleware: ", req.url);
-    
-    const response = await next(req);
-    
-    response.headers.set("Access-Control-Allow-Origin", "*");
-    return response;
-}

package/src/page/home/index.tsx

@@ -1,6 +0,0 @@
-
-
-
-export function Home(){
-    return "Home";
-}

package/src/page/home/meta.ts

@@ -1,8 +0,0 @@
-
-
-
-export const getMeta = () => {
-    return Response.json({
-        title: "Home",
-    })
-}

package/src/page/index.tsx

@@ -1,8 +0,0 @@
-
-
-
-export function Index(){
-    return <div>
-        Welcome to use WildPig!
-    </div>
-}

package/src/page/layout.tsx

@@ -1,10 +0,0 @@
-import { Outlet } from "react-router";
-
-
-
-export const MainLayout = () => {
-    return <div>
-        Main5567
-        <Outlet />
-    </div>
-}

package/src/page/meta.ts

@@ -1,8 +0,0 @@
-
-
-
-export const getMeta = async () => {
-    return Response.json({
-        title: "首页"
-    });
-}

package/src/router/guard.tsx

@@ -1,14 +0,0 @@
-import type { BrowserRouter } from "."
-
-export const RouterGuard = (browserRouter: BrowserRouter) => {
-    // 每次跳转都会触发，包括 <Link>/navigate/前进后退
-    browserRouter.subscribe(({ location }) => {
-        // navigationType 值：'PUSH' | 'POP' | 'REPLACE'
-        const url = location.pathname + location.search;
-        // apiGetMeta(location.pathname);
-        // 请求对应的meta api，修改title
-        fetch("/_WILDPIG_META_API" + url).then(res => res.json()).then(({title}) => {
-            document.title = title;
-        })
-    });
-}

package/src/router/index.tsx

@@ -1,11 +0,0 @@
-import { MainLayout } from "@/page/layout";
-import { createBrowserRouter } from "react-router";
-
-export const browserRouter = createBrowserRouter([
-    {
-        path: "/",
-        Component: MainLayout,
-    },
-]);
-
-export type BrowserRouter = typeof browserRouter;