fix: don't inject pwa into debug html
Signed-off-by: Innei <tukon479@gmail.com>
This commit is contained in:
Innei
parent
3c18768968
commit
5fec56e9b0
|
|
@ -1,8 +0,0 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Debug Proxy</title>
|
||||
<script type="module" src="./__debug_proxy.ts"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
||||
|
|
@ -1,95 +0,0 @@
|
|||
globalThis["__DEBUG_PROXY__"] = true
|
||||
|
||||
const searchParams = new URLSearchParams(window.location.search)
|
||||
const debugHost = searchParams.get("debug-host")
|
||||
|
||||
const resetSessionStorage = () => {
|
||||
sessionStorage.removeItem("debug-host")
|
||||
}
|
||||
|
||||
const resetParams = searchParams.get("reset")
|
||||
if (resetParams) {
|
||||
resetSessionStorage()
|
||||
}
|
||||
|
||||
const debugHostInSessionStorage = sessionStorage.getItem("debug-host")
|
||||
|
||||
const host = debugHost || debugHostInSessionStorage || "https://localhost:2233"
|
||||
if (debugHost) {
|
||||
sessionStorage.setItem("debug-host", debugHost)
|
||||
}
|
||||
|
||||
const createRefreshRuntimeScript = `
|
||||
import RefreshRuntime from "${host}/@react-refresh";
|
||||
RefreshRuntime.injectIntoGlobalHook(window);
|
||||
window.$RefreshReg$ = () => {};
|
||||
window.$RefreshSig$ = () => (type) => type;
|
||||
window.__vite_plugin_react_preamble_installed__ = true;
|
||||
`
|
||||
const $script = document.createElement("script")
|
||||
$script.innerHTML = createRefreshRuntimeScript
|
||||
$script.type = "module"
|
||||
document.head.append($script)
|
||||
|
||||
fetch(`${host}`)
|
||||
.then((res) => res.text())
|
||||
.then((html) => {
|
||||
const parser = new DOMParser()
|
||||
const doc = parser.parseFromString(html, "text/html")
|
||||
|
||||
const scripts = doc.querySelectorAll("script")
|
||||
|
||||
scripts.forEach((script) => {
|
||||
script.remove()
|
||||
})
|
||||
|
||||
// header meta
|
||||
|
||||
const $meta = doc.head.querySelectorAll("meta")
|
||||
$meta.forEach((meta) => {
|
||||
document.head.append(meta)
|
||||
})
|
||||
|
||||
const $style = doc.head.querySelectorAll("style")
|
||||
$style.forEach((style) => {
|
||||
document.head.append(style)
|
||||
})
|
||||
|
||||
document.body.innerHTML = doc.body.innerHTML
|
||||
|
||||
scripts.forEach((script) => {
|
||||
const $script = document.createElement("script")
|
||||
$script.type = "module"
|
||||
$script.crossOrigin = script.crossOrigin
|
||||
|
||||
if (script.src) {
|
||||
$script.src = new URL(
|
||||
script.src.startsWith("http") ? new URL(script.src).pathname : script.src,
|
||||
host,
|
||||
).toString()
|
||||
} else if (script.innerHTML) {
|
||||
$script.innerHTML = script.innerHTML
|
||||
} else {
|
||||
return
|
||||
}
|
||||
|
||||
document.body.append($script)
|
||||
})
|
||||
})
|
||||
|
||||
const injectScript = (apiUrl: string) => {
|
||||
const upstreamOrigin = window.location.origin
|
||||
const template = `function injectEnv(env2) {
|
||||
for (const key in env2) {
|
||||
if (env2[key] === void 0) continue;
|
||||
globalThis["__followEnv"] ??= {};
|
||||
globalThis["__followEnv"][key] = env2[key];
|
||||
}
|
||||
}
|
||||
injectEnv({"VITE_API_URL":"${apiUrl}","VITE_EXTERNAL_API_URL":"${apiUrl}","VITE_WEB_URL":"${upstreamOrigin}"})`
|
||||
const $script = document.createElement("script")
|
||||
$script.innerHTML = template
|
||||
document.head.prepend($script)
|
||||
}
|
||||
|
||||
injectScript(import.meta.env.VITE_API_URL)
|
||||
|
|
@ -0,0 +1,105 @@
|
|||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Debug Proxy</title>
|
||||
|
||||
<script>
|
||||
globalThis["__DEBUG_PROXY__"] = true
|
||||
|
||||
const searchParams = new URLSearchParams(window.location.search)
|
||||
const debugHost = searchParams.get("debug-host")
|
||||
|
||||
const resetSessionStorage = () => {
|
||||
sessionStorage.removeItem("debug-host")
|
||||
}
|
||||
|
||||
const resetParams = searchParams.get("reset")
|
||||
if (resetParams) {
|
||||
resetSessionStorage()
|
||||
}
|
||||
|
||||
const debugHostInSessionStorage = sessionStorage.getItem("debug-host")
|
||||
|
||||
const host = debugHost || debugHostInSessionStorage || "https://localhost:2233"
|
||||
if (debugHost) {
|
||||
sessionStorage.setItem("debug-host", debugHost)
|
||||
}
|
||||
|
||||
const createRefreshRuntimeScript = `
|
||||
import RefreshRuntime from "${host}/@react-refresh";
|
||||
RefreshRuntime.injectIntoGlobalHook(window);
|
||||
window.$RefreshReg$ = () => {};
|
||||
window.$RefreshSig$ = () => (type) => type;
|
||||
window.__vite_plugin_react_preamble_installed__ = true;
|
||||
`
|
||||
const $script = document.createElement("script")
|
||||
$script.innerHTML = createRefreshRuntimeScript
|
||||
$script.type = "module"
|
||||
document.head.append($script)
|
||||
|
||||
fetch(`${host}`)
|
||||
.then((res) => res.text())
|
||||
.then((html) => {
|
||||
const parser = new DOMParser()
|
||||
const doc = parser.parseFromString(html, "text/html")
|
||||
|
||||
const scripts = doc.querySelectorAll("script")
|
||||
|
||||
scripts.forEach((script) => {
|
||||
script.remove()
|
||||
})
|
||||
|
||||
// header meta
|
||||
|
||||
const $meta = doc.head.querySelectorAll("meta")
|
||||
$meta.forEach((meta) => {
|
||||
document.head.append(meta)
|
||||
})
|
||||
|
||||
const $style = doc.head.querySelectorAll("style")
|
||||
$style.forEach((style) => {
|
||||
document.head.append(style)
|
||||
})
|
||||
|
||||
document.body.innerHTML = doc.body.innerHTML
|
||||
|
||||
scripts.forEach((script) => {
|
||||
const $script = document.createElement("script")
|
||||
$script.type = "module"
|
||||
$script.crossOrigin = script.crossOrigin
|
||||
|
||||
if (script.src) {
|
||||
$script.src = new URL(
|
||||
script.src.startsWith("http") ? new URL(script.src).pathname : script.src,
|
||||
host,
|
||||
).toString()
|
||||
} else if (script.innerHTML) {
|
||||
$script.innerHTML = script.innerHTML
|
||||
} else {
|
||||
return
|
||||
}
|
||||
|
||||
document.body.append($script)
|
||||
})
|
||||
})
|
||||
|
||||
const injectScript = (apiUrl) => {
|
||||
const upstreamOrigin = window.location.origin
|
||||
const template = `function injectEnv(env2) {
|
||||
for (const key in env2) {
|
||||
if (env2[key] === void 0) continue;
|
||||
globalThis["__followEnv"] ??= {};
|
||||
globalThis["__followEnv"][key] = env2[key];
|
||||
}
|
||||
}
|
||||
injectEnv({"VITE_API_URL":"${apiUrl}","VITE_EXTERNAL_API_URL":"${apiUrl}","VITE_WEB_URL":"${upstreamOrigin}"})`
|
||||
const $script = document.createElement("script")
|
||||
$script.innerHTML = template
|
||||
document.head.prepend($script)
|
||||
}
|
||||
|
||||
injectScript(import.meta.env.VITE_API_URL)
|
||||
</script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
import { useMobile } from "@follow/components/hooks/useMobile.js"
|
||||
import { AutoResizeHeight } from "@follow/components/ui/auto-resize-height/index.js"
|
||||
import { ActionButton, MotionButtonBase } from "@follow/components/ui/button/index.js"
|
||||
import { ActionButton } from "@follow/components/ui/button/index.js"
|
||||
import { Skeleton } from "@follow/components/ui/skeleton/index.jsx"
|
||||
import type { MediaModel } from "@follow/shared/hono"
|
||||
import { LRUCache } from "@follow/utils/lru-cache"
|
||||
|
|
@ -379,15 +379,15 @@ const CollapsedSocialMediaItem: Component<{
|
|||
"relative",
|
||||
!isShowMore && "max-h-[300px] overflow-hidden",
|
||||
isShowMore && "h-auto",
|
||||
!isShowMore && isOverflow && "mask-b-xl",
|
||||
!isShowMore && isOverflow && "mask-b-2xl",
|
||||
)}
|
||||
ref={ref}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
{isOverflow && !isShowMore && (
|
||||
<div className="absolute inset-x-0 bottom-0 flex justify-center py-2 duration-200">
|
||||
<MotionButtonBase
|
||||
<div className="absolute inset-x-0 -bottom-2 flex justify-center py-2 duration-200">
|
||||
<button
|
||||
type="button"
|
||||
onClick={(e) => {
|
||||
e.stopPropagation()
|
||||
|
|
@ -395,11 +395,11 @@ const CollapsedSocialMediaItem: Component<{
|
|||
collapsedItemCache.put(entryId, true)
|
||||
}}
|
||||
aria-hidden
|
||||
className="flex items-center justify-center text-xs"
|
||||
className="flex items-center justify-center text-xs duration-200 hover:text-foreground"
|
||||
>
|
||||
<i className="i-mingcute-arrow-to-down-line" />
|
||||
<span className="ml-2">Show more</span>
|
||||
</MotionButtonBase>
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</AutoResizeHeight>
|
||||
|
|
|
|||
|
|
@ -409,6 +409,10 @@
|
|||
mask-image: linear-gradient(rgb(255, 255, 255) calc(100% - 70px), rgba(255, 255, 255, 0) 100%);
|
||||
}
|
||||
|
||||
.mask-b-2xl {
|
||||
mask-image: linear-gradient(rgb(255, 255, 255) calc(100% - 90px), rgba(255, 255, 255, 0) 100%);
|
||||
}
|
||||
|
||||
.mask-horizontal {
|
||||
mask-image: linear-gradient(
|
||||
90deg,
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
import { copyFileSync, existsSync } from "node:fs"
|
||||
import { resolve } from "node:path"
|
||||
import { fileURLToPath } from "node:url"
|
||||
|
||||
|
|
@ -5,7 +6,7 @@ import legacy from "@vitejs/plugin-legacy"
|
|||
import { minify as htmlMinify } from "html-minifier-terser"
|
||||
import { cyan, dim, green } from "kolorist"
|
||||
import { parseHTML } from "linkedom"
|
||||
import type { PluginOption, ViteDevServer } from "vite"
|
||||
import type { PluginOption, ResolvedConfig, ViteDevServer } from "vite"
|
||||
import { defineConfig, loadEnv } from "vite"
|
||||
import { analyzer } from "vite-bundle-analyzer"
|
||||
import mkcert from "vite-plugin-mkcert"
|
||||
|
|
@ -57,7 +58,6 @@ export default ({ mode }) => {
|
|||
rollupOptions: {
|
||||
input: {
|
||||
main: resolve(ROOT, "/index.html"),
|
||||
__debug_proxy: resolve(ROOT, "/__debug_proxy.html"),
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
@ -134,6 +134,7 @@ export default ({ mode }) => {
|
|||
globPatterns: [
|
||||
"**/*.{js,json,css,html,txt,svg,png,ico,webp,woff,woff2,ttf,eot,otf,wasm}",
|
||||
],
|
||||
|
||||
manifestTransforms: [
|
||||
(manifest) => {
|
||||
return {
|
||||
|
|
@ -288,9 +289,22 @@ function checkBrowserSupport() {
|
|||
}
|
||||
|
||||
const htmlPlugin: (env: any) => PluginOption = () => {
|
||||
let config: ResolvedConfig
|
||||
return {
|
||||
name: "html-transform",
|
||||
configResolved(resolvedConfig) {
|
||||
config = resolvedConfig
|
||||
},
|
||||
enforce: "post",
|
||||
closeBundle() {
|
||||
const { root } = config
|
||||
const dist = config.build.outDir
|
||||
const debugProxyHtml = resolve(root, "debug_proxy.html")
|
||||
|
||||
if (existsSync(debugProxyHtml)) {
|
||||
copyFileSync(debugProxyHtml, resolve(dist, "__debug_proxy.html"))
|
||||
}
|
||||
},
|
||||
transformIndexHtml(html) {
|
||||
return htmlMinify(
|
||||
html.replace(
|
||||
|
|
|
|||
Loading…
Reference in New Issue