build: bundle size (#49)

This commit is contained in:
BiggerRain
2024-12-12 19:41:14 +08:00
committed by GitHub
parent df36340f6f
commit 72b60db618
11 changed files with 95 additions and 152 deletions

6
.gitignore vendored
View File

@@ -13,9 +13,9 @@ dist-ssr
*.local
# Editor directories and files
.vscode/*
!.vscode/extensions.json
!.vscode/settings.json
# .vscode/*
# !.vscode/extensions.json
# !.vscode/settings.json
.idea
.DS_Store
*.suo

32
.vscode/launch.json vendored Normal file
View File

@@ -0,0 +1,32 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "lldb",
"request": "launch",
"name": "Tauri Development Debug",
"cargo": {
"args": [
"build",
"--manifest-path=./src-tauri/Cargo.toml",
"--no-default-features"
]
},
// task for the `beforeDevCommand` if used, must be configured in `.vscode/tasks.json`
"preLaunchTask": "ui:dev"
},
{
"type": "lldb",
"request": "launch",
"name": "Tauri Production Debug",
"cargo": {
"args": ["build", "--release", "--manifest-path=./src-tauri/Cargo.toml"]
},
// task for the `beforeBuildCommand` if used, must be configured in `.vscode/tasks.json`
"preLaunchTask": "ui:build"
}
]
}

25
.vscode/tasks.json vendored Normal file
View File

@@ -0,0 +1,25 @@
{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [
{
"label": "ui:dev",
"type": "shell",
// `dev` keeps running in the background
// ideally you should also configure a `problemMatcher`
// see https://code.visualstudio.com/docs/editor/tasks#_can-a-background-task-be-used-as-a-prelaunchtask-in-launchjson
"isBackground": true,
// change this to your `beforeDevCommand`:
"command": "yarn",
"args": ["dev"]
},
{
"label": "ui:build",
"type": "shell",
// change this to your `beforeBuildCommand`:
"command": "yarn",
"args": ["build"]
}
]
}

View File

@@ -19,14 +19,11 @@
"@tauri-apps/plugin-shell": ">=2.0.0",
"@tauri-apps/plugin-websocket": "~2",
"@tauri-apps/plugin-window": "2.0.0-alpha.1",
"@traptitech/markdown-it-katex": "^3.6.0",
"axios": "^1.7.7",
"clsx": "^2.1.1",
"highlight.js": "^11.10.0",
"i18next": "^23.16.2",
"lodash": "^4.17.21",
"lucide-react": "^0.453.0",
"markdown-it": "^14.1.0",
"mermaid": "^11.4.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",

63
pnpm-lock.yaml generated
View File

@@ -35,18 +35,12 @@ importers:
'@tauri-apps/plugin-window':
specifier: 2.0.0-alpha.1
version: 2.0.0-alpha.1
'@traptitech/markdown-it-katex':
specifier: ^3.6.0
version: 3.6.0
axios:
specifier: ^1.7.7
version: 1.7.7
clsx:
specifier: ^2.1.1
version: 2.1.1
highlight.js:
specifier: ^11.10.0
version: 11.10.0
i18next:
specifier: ^23.16.2
version: 23.16.2
@@ -56,9 +50,6 @@ importers:
lucide-react:
specifier: ^0.453.0
version: 0.453.0(react@18.3.1)
markdown-it:
specifier: ^14.1.0
version: 14.1.0
mermaid:
specifier: ^11.4.0
version: 11.4.0
@@ -716,9 +707,6 @@ packages:
'@tauri-apps/plugin-window@2.0.0-alpha.1':
resolution: {integrity: sha512-dFOAgal/3Txz3SQ+LNQq0AK1EPC+acdaFlwPVB/6KXUZYmaFleIlzgxDVoJCQ+/xOhxvYrdQaFLefh0I/Kldbg==}
'@traptitech/markdown-it-katex@3.6.0':
resolution: {integrity: sha512-CnJzTWxsgLGXFdSrWRaGz7GZ1kUUi8g3E9HzJmeveX1YwVJavrKYqysktfHZQsujdnRqV5O7g8FPKEA/aeTkOQ==}
'@types/babel__core@7.20.5':
resolution: {integrity: sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==}
@@ -935,9 +923,6 @@ packages:
arg@5.0.2:
resolution: {integrity: sha512-PYjyFOLKQ9y57JvQ6QLo8dAgNqswh8M1RMJYdQduT6xbWSgK36P/Z/v+p888pM69jMMfS8Xd8F6I1kQ/I9HUGg==}
argparse@2.0.1:
resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
asynckit@0.4.0:
resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==}
@@ -1404,10 +1389,6 @@ packages:
hastscript@8.0.0:
resolution: {integrity: sha512-dMOtzCEd3ABUeSIISmrETiKuyydk1w0pa+gE/uormcTpSYuaNJPbX1NU3JLyscSLjwAQM8bWMhhIlnCqnRvDTw==}
highlight.js@11.10.0:
resolution: {integrity: sha512-SYVnVFswQER+zu1laSya563s+F8VDGt7o35d4utbamowvUNLLMovFqwCLSocpZTz3MgaSRA1IbqRWZv97dtErQ==}
engines: {node: '>=12.0.0'}
highlight.js@11.9.0:
resolution: {integrity: sha512-fJ7cW7fQGCYAkgv4CPfwFHrfd/cLS4Hau96JuJ+ZTOWhjnhoeN1ub1tFmALm/+lW5z4WCAuAV9bm05AP0mS6Gw==}
engines: {node: '>=12.0.0'}
@@ -1529,9 +1510,6 @@ packages:
lines-and-columns@1.2.4:
resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
linkify-it@5.0.0:
resolution: {integrity: sha512-5aHCbzQRADcdP+ATqnDuhhJ/MRIqDkZX5pyjFHRRysS8vZ5AbqGEoFIb6pYHPZ+L/OC2Lc+xT8uHVVR5CAK/wQ==}
local-pkg@0.5.0:
resolution: {integrity: sha512-ok6z3qlYyCDS4ZEU27HaU6x/xZa9Whf8jD4ptH5UZTQYZVYeb9bnZ3ojVhiJNLiXK1Hfc0GNbLXcmZ5plLDDBg==}
engines: {node: '>=14'}
@@ -1563,10 +1541,6 @@ packages:
peerDependencies:
react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0-rc
markdown-it@14.1.0:
resolution: {integrity: sha512-a54IwgWPaeBCAAsv13YgmALOF1elABB08FxO9i+r4VFk5Vl4pKokRPeX8u5TCgSsPi6ec1otfLjdOpVcgbpshg==}
hasBin: true
markdown-table@3.0.4:
resolution: {integrity: sha512-wiYz4+JrLyb/DqW2hkFJxP7Vd7JuTDm77fvbM8VfEQdmSMqcImWeeRbHwZjBjIFki/VaMK2BhFi7oUUZeM5bqw==}
@@ -1626,9 +1600,6 @@ packages:
mdast-util-to-string@4.0.0:
resolution: {integrity: sha512-0H44vDimn51F0YwvxSJSm0eCDOJTRlmN0R1yBh4HLj9wiV1Dn0QoXGbvFAWj2hSItVTlCmBF1hqKlIyUBVFLPg==}
mdurl@2.0.0:
resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==}
merge2@1.4.1:
resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
engines: {node: '>= 8'}
@@ -1876,10 +1847,6 @@ packages:
proxy-from-env@1.1.0:
resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
punycode.js@2.3.1:
resolution: {integrity: sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA==}
engines: {node: '>=6'}
queue-microtask@1.2.3:
resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
@@ -2107,9 +2074,6 @@ packages:
engines: {node: '>=14.17'}
hasBin: true
uc.micro@2.1.0:
resolution: {integrity: sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==}
ufo@1.5.4:
resolution: {integrity: sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ==}
@@ -2770,10 +2734,6 @@ snapshots:
dependencies:
'@tauri-apps/api': 2.0.0-alpha.6
'@traptitech/markdown-it-katex@3.6.0':
dependencies:
katex: 0.16.11
'@types/babel__core@7.20.5':
dependencies:
'@babel/parser': 7.25.8
@@ -3023,8 +2983,6 @@ snapshots:
arg@5.0.2: {}
argparse@2.0.1: {}
asynckit@0.4.0: {}
autoprefixer@10.4.20(postcss@8.4.47):
@@ -3563,8 +3521,6 @@ snapshots:
property-information: 6.5.0
space-separated-tokens: 2.0.2
highlight.js@11.10.0: {}
highlight.js@11.9.0: {}
html-parse-stringify@3.0.1:
@@ -3660,10 +3616,6 @@ snapshots:
lines-and-columns@1.2.4: {}
linkify-it@5.0.0:
dependencies:
uc.micro: 2.1.0
local-pkg@0.5.0:
dependencies:
mlly: 1.7.2
@@ -3695,15 +3647,6 @@ snapshots:
dependencies:
react: 18.3.1
markdown-it@14.1.0:
dependencies:
argparse: 2.0.1
entities: 4.5.0
linkify-it: 5.0.0
mdurl: 2.0.0
punycode.js: 2.3.1
uc.micro: 2.1.0
markdown-table@3.0.4: {}
marked@13.0.3: {}
@@ -3878,8 +3821,6 @@ snapshots:
dependencies:
'@types/mdast': 4.0.4
mdurl@2.0.0: {}
merge2@1.4.1: {}
mermaid@11.4.0:
@@ -4247,8 +4188,6 @@ snapshots:
proxy-from-env@1.1.0: {}
punycode.js@2.3.1: {}
queue-microtask@1.2.3: {}
react-dom@18.3.1(react@18.3.1):
@@ -4552,8 +4491,6 @@ snapshots:
typescript@5.6.3: {}
uc.micro@2.1.0: {}
ufo@1.5.4: {}
undici-types@6.19.8: {}

View File

@@ -98,7 +98,7 @@
}
}
},
"resources": ["icons"]
"resources": ["assets", "icons"]
},
"plugins": {
"window": {},

View File

@@ -1,5 +1,7 @@
import React from "react";
import type { Message } from "./types";
import { Markdown } from "./Markdown";
const Markdown = React.lazy(() => import('./Markdown'));
interface ChatMessageProps {
message: Message;

View File

@@ -15,7 +15,7 @@ import "./markdown.css";
import "./highlight.css";
// 8
export function Mermaid(props: { code: string }) {
function Mermaid(props: { code: string }) {
const ref = useRef<HTMLDivElement>(null);
const [hasError, setHasError] = useState(false);
@@ -63,7 +63,7 @@ export function Mermaid(props: { code: string }) {
}
// 7
export function PreCode(props: { children?: any }) {
function PreCode(props: { children?: any }) {
const ref = useRef<HTMLPreElement>(null);
// const previewRef = useRef<HTMLPreviewHander>(null);
const [mermaidCode, setMermaidCode] = useState("");
@@ -278,10 +278,10 @@ function _MarkDownContent(props: { content: string }) {
}
// 2
export const MarkdownContent = React.memo(_MarkDownContent);
const MarkdownContent = React.memo(_MarkDownContent);
// 1
export function Markdown(
export default function Markdown(
props: {
content: string;
loading?: boolean;

View File

@@ -20,12 +20,14 @@ function Search({ isTransitioned, isChatMode, input }: SearchProps) {
const mainWindowRef = useRef<HTMLDivElement>(null);
useEffect(() => {
if(!isTauri()) return;
if (!isTauri()) return;
const element = mainWindowRef.current;
if (!element) return;
const resizeObserver = new ResizeObserver(async (entries) => {
const { getCurrentWebviewWindow } = await import("@tauri-apps/api/webviewWindow");
const { getCurrentWebviewWindow } = await import(
"@tauri-apps/api/webviewWindow"
);
const { LogicalSize } = await import("@tauri-apps/api/dpi");
for (let entry of entries) {
@@ -82,7 +84,7 @@ function Search({ isTransitioned, isChatMode, input }: SearchProps) {
if (!input) setSuggests([]);
}, [input]);
// if (isChatMode || suggests.length === 0) return null;
if (isChatMode || suggests.length === 0) return null;
return (
<div
@@ -94,7 +96,7 @@ function Search({ isTransitioned, isChatMode, input }: SearchProps) {
backgroundSize: "101% 100%",
}}
>
{isChatMode ? null : (
{!isChatMode ? (
<div
ref={mainWindowRef}
className={`max-h-[498px] pb-10 w-full relative`}
@@ -114,7 +116,7 @@ function Search({ isTransitioned, isChatMode, input }: SearchProps) {
<Footer isChat={false} name={selectedItem?.source} />
) : null}
</div>
)}
) : null}
</div>
);
}

View File

@@ -110,80 +110,14 @@ export default function WebSearch() {
return (
<div className="fixed inset-0 z-50 overflow-y-auto">
<div className="min-h-screen px-4 text-center">
<div className="min-h-screen px-4 pt-20 text-center">
<div
className="fixed inset-0 bg-black/50 transition-opacity"
onClick={() => setIsOpen(false)}
/>
<div className="inline-block w-full max-w-2xl my-16 text-left align-middle transition-all transform">
<div className="inline-block w-[100%] max-w-2xl text-left align-middle transition-all transform">
<SearchChat />
{/* <div className="relative bg-white rounded-xl shadow-2xl overflow-hidden">
<div className="flex items-center px-4 border-b border-gray-200">
<Search className="w-5 h-5 text-gray-400" />
<input
autoFocus
type="text"
className="w-full px-4 py-4 text-gray-700 bg-transparent border-none focus:outline-none focus:ring-0"
placeholder="Search commands..."
value={search}
onChange={(e) => setSearch(e.target.value)}
/>
<div className="w-32 flex items-center gap-1">
<kbd className="px-2 py-1 text-xs font-semibold text-gray-500 bg-gray-100 border border-gray-200 rounded-md">
Esc
</kbd>
<span className="text-gray-400">to close</span>
</div>
</div>
<div className="max-h-[60vh] overflow-y-auto">
{filteredCommands.length === 0 ? (
<div className="px-4 py-14 text-center text-gray-500">
No results found.
</div>
) : (
<div className="py-2">
{filteredCommands.map((command, index) => (
<div
key={command.id}
className={`px-4 py-3 flex items-center gap-3 cursor-pointer transition-colors ${
selectedIndex === index
? "bg-blue-50 text-blue-700"
: "text-gray-700 hover:bg-gray-50"
}`}
onClick={() => {
command.action();
setIsOpen(false);
}}
>
<div
className={`${
selectedIndex === index
? "text-blue-600"
: "text-gray-400"
}`}
>
{command.icon}
</div>
<div>
<div className="font-medium">{command.title}</div>
<div
className={`text-sm ${
selectedIndex === index
? "text-blue-500"
: "text-gray-500"
}`}
>
{command.description}
</div>
</div>
</div>
))}
</div>
)}
</div>
</div> */}
</div>
</div>
</div>

View File

@@ -40,4 +40,18 @@ export default defineConfig(async () => ({
},
},
},
build: {
rollupOptions: {
output: {
manualChunks: {
vendor: ['react', 'react-dom'],
lodash: ['lodash'],
katex: ['rehype-katex'],
highlight: ['rehype-highlight'],
mermaid: ['mermaid'],
}
},
},
chunkSizeWarningLimit: 600,
},
}));