fix: app routing
This commit is contained in:
parent
b5fbdc17d2
commit
34c2f9e346
26
src/App.tsx
26
src/App.tsx
|
|
@ -1,26 +1,22 @@
|
||||||
import { Component, createSignal, onMount } from 'solid-js';
|
import { Component, createSignal, onMount } from "solid-js";
|
||||||
import { useLocation } from '@solidjs/router';
|
import { useLocation } from "@solidjs/router";
|
||||||
|
|
||||||
// 导入组件以注册自定义元素
|
// 导入组件以注册自定义元素
|
||||||
import './components';
|
import "./components";
|
||||||
import { Article } from './components';
|
import { Article } from "./components";
|
||||||
|
|
||||||
const App: Component = () => {
|
const App: Component = () => {
|
||||||
const location = useLocation();
|
const location = useLocation();
|
||||||
const [currentPath, setCurrentPath] = createSignal('');
|
const [currentPath, setCurrentPath] = createSignal("");
|
||||||
|
|
||||||
onMount(() => {
|
onMount(() => {
|
||||||
// 根据路由加载对应的 markdown 文件
|
// 根据路由加载对应的 markdown 文件
|
||||||
let path = decodeURIComponent(location.pathname.slice(1));
|
let path = decodeURIComponent(location.pathname);
|
||||||
if (!path) {
|
|
||||||
path = '/content/index.md';
|
if (!path) path = "/content/";
|
||||||
} else if (!path.startsWith('/content/')) {
|
if (path.endsWith("/")) path += "index";
|
||||||
path = `/content/${path}`;
|
if (!path.endsWith(".md")) path += ".md";
|
||||||
}
|
|
||||||
// 确保有 .md 扩展名
|
|
||||||
if (!path.endsWith('.md')) {
|
|
||||||
path = `${path}.md`;
|
|
||||||
}
|
|
||||||
setCurrentPath(path);
|
setCurrentPath(path);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -2,13 +2,6 @@ let dataIndex: Record<string, string> | null = null;
|
||||||
let isDevIndexLoaded = false;
|
let isDevIndexLoaded = false;
|
||||||
let isCliIndexLoaded = false;
|
let isCliIndexLoaded = false;
|
||||||
|
|
||||||
/**
|
|
||||||
* 设置全局数据索引(CLI 环境使用)
|
|
||||||
*/
|
|
||||||
export function setDataIndex(index: Record<string, string>) {
|
|
||||||
dataIndex = index;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 从索引获取数据
|
* 从索引获取数据
|
||||||
*/
|
*/
|
||||||
|
|
@ -27,13 +20,16 @@ async function loadDevIndex(): Promise<void> {
|
||||||
isDevIndexLoaded = true;
|
isDevIndexLoaded = true;
|
||||||
|
|
||||||
// @ts-ignore - import.meta.glob 在构建时会被处理
|
// @ts-ignore - import.meta.glob 在构建时会被处理
|
||||||
if (typeof import.meta !== 'undefined' && import.meta.glob) {
|
if (typeof import.meta !== "undefined" && import.meta.glob) {
|
||||||
try {
|
try {
|
||||||
// @ts-ignore - 只加载 .csv 和 .md 文件
|
// @ts-ignore - 只加载 .csv 和 .md 文件
|
||||||
const modules = import.meta.glob('../../content/**/*.{csv,md}', { as: 'raw', eager: true });
|
const modules = import.meta.glob("../../content/**/*.{csv,md}", {
|
||||||
|
as: "raw",
|
||||||
|
eager: true,
|
||||||
|
});
|
||||||
const index: Record<string, string> = {};
|
const index: Record<string, string> = {};
|
||||||
for (const [path, content] of Object.entries(modules)) {
|
for (const [path, content] of Object.entries(modules)) {
|
||||||
const normalizedPath = path.replace('/src/', '/');
|
const normalizedPath = path.replace("/src/", "/");
|
||||||
index[normalizedPath] = content as string;
|
index[normalizedPath] = content as string;
|
||||||
}
|
}
|
||||||
dataIndex = { ...dataIndex, ...index };
|
dataIndex = { ...dataIndex, ...index };
|
||||||
|
|
@ -51,9 +47,9 @@ async function loadCliIndex(): Promise<void> {
|
||||||
isCliIndexLoaded = true;
|
isCliIndexLoaded = true;
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const response = await fetch('/__CONTENT_INDEX.json');
|
const response = await fetch("/__CONTENT_INDEX.json");
|
||||||
if (!response.ok) {
|
if (!response.ok) {
|
||||||
throw new Error('Failed to fetch content index');
|
throw new Error("Failed to fetch content index");
|
||||||
}
|
}
|
||||||
const index = await response.json();
|
const index = await response.json();
|
||||||
dataIndex = { ...dataIndex, ...index };
|
dataIndex = { ...dataIndex, ...index };
|
||||||
|
|
@ -81,6 +77,7 @@ export async function fetchData(path: string): Promise<string> {
|
||||||
}
|
}
|
||||||
|
|
||||||
// 索引不存在时,使用 fetch 加载
|
// 索引不存在时,使用 fetch 加载
|
||||||
|
if (dataIndex !== null) throw new Error(`no data in index: ${path}`);
|
||||||
try {
|
try {
|
||||||
const response = await fetch(path);
|
const response = await fetch(path);
|
||||||
if (!response.ok) {
|
if (!response.ok) {
|
||||||
|
|
@ -88,7 +85,7 @@ export async function fetchData(path: string): Promise<string> {
|
||||||
}
|
}
|
||||||
return await response.text();
|
return await response.text();
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error('fetchData error:', error);
|
console.error("fetchData error:", error);
|
||||||
throw error;
|
throw error;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
25
src/main.tsx
25
src/main.tsx
|
|
@ -1,15 +1,18 @@
|
||||||
import { render } from 'solid-js/web';
|
import { render } from "solid-js/web";
|
||||||
import { Router, Route } from '@solidjs/router';
|
import { Router, Route } from "@solidjs/router";
|
||||||
import App from './App';
|
import App from "./App";
|
||||||
import './styles.css';
|
import "./styles.css";
|
||||||
|
|
||||||
const root = document.getElementById('root');
|
const root = document.getElementById("root");
|
||||||
|
|
||||||
if (root) {
|
if (root) {
|
||||||
render(() => (
|
render(
|
||||||
<Router>
|
() => (
|
||||||
<Route path="/" component={App} />
|
<Router>
|
||||||
<Route path="/:path*" component={App} />
|
<Route path="/" component={App} />
|
||||||
</Router>
|
<Route path="/*" component={App} />
|
||||||
), root);
|
</Router>
|
||||||
|
),
|
||||||
|
root,
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue