Skip to content
This repository was archived by the owner on Jul 6, 2025. It is now read-only.

Commit b7d9317

Browse files
author
Je
committed
fix: fix routing not adapted automaticlly
1 parent 1a03029 commit b7d9317

File tree

5 files changed

+56
-52
lines changed

5 files changed

+56
-52
lines changed

‎aleph.ts

Lines changed: 16 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export function ALEPH({ initial }: {
1212
url: RouterURL
1313
staticData: Record<string, any>
1414
components: Record<string, ComponentType<any>>
15-
pageProps: PageProps
15+
pageProps: PageProps | null
1616
}
1717
}) {
1818
const ref = useRef({ routing: initial.routing })
@@ -29,7 +29,7 @@ export function ALEPH({ initial }: {
2929
Component: App ? (util.isLikelyReactComponent(App) ? App : E501App) : null
3030
}
3131
})
32-
const [page, setPage] = useState<{ url: RouterURL, pageProps: PageProps | null }>(() => {
32+
const [page, setPage] = useState(() => {
3333
const { url, pageProps } = initial
3434
return { pageProps, url }
3535
})
@@ -40,11 +40,11 @@ export function ALEPH({ initial }: {
4040
if (url.pagePath !== '') {
4141
const ctree: { id: string, Component?: ComponentType<any> }[] = pageModuleTree.map(({ id }) => ({ id }))
4242
const imports = pageModuleTree.map(async mod => {
43-
const { default: C } = await import(getModuleImportUrl(baseUrl, mod))
43+
const { default: C } = await import(getModuleImportUrl(baseUrl, mod, e.forceFetch))
4444
if (mod.asyncDeps) {
4545
// import async dependencies
4646
for (const dep of mod.asyncDeps) {
47-
await import(getModuleImportUrl(baseUrl, { id: dep.url.replace(reModuleExt, '.js'), hash: dep.hash }))
47+
await import(getModuleImportUrl(baseUrl, { id: dep.url.replace(reModuleExt, '.js'), hash: dep.hash }, e.forceFetch))
4848
}
4949
}
5050
const pc = ctree.find(pc => pc.id === mod.id)
@@ -61,14 +61,16 @@ export function ALEPH({ initial }: {
6161
Page: ctree[0].Component || (() => null),
6262
pageProps: {}
6363
}
64-
ctree.slice(1).reduce((p, m) => {
65-
const c: PageProps = {
66-
Page: m.Component || (() => null),
67-
pageProps: {}
68-
}
69-
p.pageProps = c
70-
return c
71-
}, pageProps)
64+
if (ctree.length > 1) {
65+
ctree.slice(1).reduce((p, m) => {
66+
const c = {
67+
Page: m.Component || (() => null),
68+
pageProps: {}
69+
}
70+
p.pageProps = c
71+
return c
72+
}, pageProps)
73+
}
7274
setPage({ url, pageProps })
7375
if (util.isInt(e.scrollTo)) {
7476
(window as any).scrollTo(e.scrollTo, 0)
@@ -125,6 +127,7 @@ export function ALEPH({ initial }: {
125127
if (mod.id.startsWith('/pages/')) {
126128
const { routing } = ref.current
127129
routing.update(mod)
130+
events.emit('popstate', { type: 'popstate', forceFetch: true })
128131
}
129132
break
130133
}
@@ -146,6 +149,7 @@ export function ALEPH({ initial }: {
146149
if (moduleId.startsWith('/pages/')) {
147150
const { routing } = ref.current
148151
routing.removeRoute(moduleId)
152+
events.emit('popstate', { type: 'popstate' })
149153
}
150154
break
151155
}

‎bootstrap.ts

Lines changed: 13 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,10 @@ export default async function bootstrap({
2121
}) {
2222
const { document } = window as any
2323
const mainEl = document.querySelector('main')
24-
const routing = new Routing(routes, baseUrl, defaultLocale, locales)
25-
const [url, pageModuleTree] = routing.createRouter()
26-
27-
if (url.pagePath === '') {
28-
throw new Error('invalid router')
29-
}
30-
3124
const staticData: Record<string, any> = {}
3225
const components: Record<string, ComponentType> = {}
26+
const routing = new Routing(routes, baseUrl, defaultLocale, locales)
27+
const [url, pageModuleTree] = routing.createRouter()
3328
const ctree: { id: string, Component?: ComponentType }[] = pageModuleTree.map(({ id }) => ({ id }))
3429
const imports = [...preloadModules, ...pageModuleTree].map(async mod => {
3530
const { default: C } = await import(getModuleImportUrl(baseUrl, mod))
@@ -63,18 +58,20 @@ export default async function bootstrap({
6358
})
6459
await Promise.all(imports)
6560

66-
const pageProps: PageProps = {
61+
const pageProps: PageProps | null = url.pagePath != '' ? {
6762
Page: ctree[0].Component || (() => null),
6863
pageProps: {}
64+
} : null
65+
if (pageProps && ctree.length > 1) {
66+
ctree.slice(1).reduce((p, m) => {
67+
const c = {
68+
Page: m.Component || (() => null),
69+
pageProps: {}
70+
}
71+
p.pageProps = c
72+
return c
73+
}, pageProps)
6974
}
70-
ctree.slice(1).reduce((p, m) => {
71-
const c = {
72-
Page: m.Component || (() => null),
73-
pageProps: {}
74-
}
75-
p.pageProps = c
76-
return c
77-
}, pageProps)
7875
const el = React.createElement(
7976
ALEPH,
8077
{

‎hmr.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ socket.addEventListener('message', ({ data: rawData }: { data?: string }) => {
7979
const { type, moduleId, hash, updateUrl } = JSON.parse(rawData)
8080
switch (type) {
8181
case 'add':
82-
events.emit('add-module', { moduleId, hash })
82+
events.emit('add-module', { id: moduleId, hash })
8383
break
8484
case 'update':
8585
const mod = modules.get(moduleId)

‎project.ts

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ interface Module {
2828
}
2929

3030
interface RenderResult {
31+
url: RouterURL
3132
status: number
3233
head: string[]
3334
body: string
@@ -181,14 +182,8 @@ export class Project {
181182

182183
async getPageHtml(loc: { pathname: string, search?: string }): Promise<[number, string]> {
183184
const { baseUrl } = this.config
184-
const [url, pageModuleTree] = this.#routing.createRouter(loc)
185-
186-
if (url.pagePath === '') {
187-
return [200, this.getDefaultIndexHtml()]
188-
}
189-
190185
const mainModule = this.#modules.get('/main.js')!
191-
const { status, head, body } = await this._renderPage(url, pageModuleTree)
186+
const { url, status, head, body } = await this._renderPage(loc)
192187
const html = createHtml({
193188
lang: url.locale,
194189
head: head,
@@ -525,12 +520,13 @@ export class Project {
525520
}
526521
if (moduleID.startsWith('/pages/')) {
527522
this.#routing.update(this._getPageModule(mod))
523+
this._createMainModule()
528524
} else if (moduleID.startsWith('/api/')) {
529525
this.#apiRouting.update(this._getPageModule(mod))
530526
}
531527
this._updateDependency(path, mod.hash, ({ id: moduleID }) => {
532528
if (!hmrable && this.isHMRable(moduleID)) {
533-
this.#fsWatchListeners.forEach(e => e.emit(moduleID, 'modify', mod.hash))
529+
this.#fsWatchListeners.forEach(e => e.emit('modify-' + moduleID, mod.hash))
534530
}
535531
})
536532
}).catch(err => {
@@ -539,6 +535,7 @@ export class Project {
539535
} else if (this.#modules.has(moduleID)) {
540536
if (moduleID.startsWith('/pages/')) {
541537
this.#routing.removeRoute(moduleID)
538+
this._createMainModule()
542539
} else if (moduleID.startsWith('/api/')) {
543540
this.#apiRouting.removeRoute(moduleID)
544541
}
@@ -1038,9 +1035,10 @@ export class Project {
10381035
return rewrittenPath.replace(reModuleExt, '') + '.js'
10391036
}
10401037

1041-
private async _renderPage(url: RouterURL, pageModuleTree: { id: string, hash: string }[]) {
1038+
private async _renderPage(loc: { pathname: string, search?: string }) {
10421039
const start = performance.now()
1043-
const ret: RenderResult = { status: 200, head: [], body: '<main></main>' }
1040+
const [url, pageModuleTree] = this.#routing.createRouter(loc)
1041+
const ret: RenderResult = { url, status: url.pagePath === '' ? 404 : 200, head: [], body: '<main></main>' }
10441042
Object.assign(window, {
10451043
location: {
10461044
protocol: 'http:',
@@ -1061,7 +1059,7 @@ export class Project {
10611059
const appModule = this.#modules.get('/app.js')
10621060
const { E501Page } = await import('file://' + this.#modules.get('//deno.land/x/aleph/error.js')!.jsFile)
10631061
const { renderPage, renderHead } = await import('file://' + this.#modules.get('//deno.land/x/aleph/renderer.js')!.jsFile)
1064-
const { default: App } = appModule ? await import('file://' + appModule.jsFile) : {} as any
1062+
const { default: App } = appModule && url.pagePath != '' ? await import('file://' + appModule.jsFile) : {} as any
10651063
const staticData = await this.getStaticData()
10661064
const pageComponentTree: { id: string, Component?: any }[] = pageModuleTree.map(({ id }) => ({ id }))
10671065
const imports = pageModuleTree.map(async ({ id }) => {
@@ -1082,10 +1080,13 @@ export class Project {
10821080
appModule ? this._lookupStyleDeps(appModule.id) : [],
10831081
...pageModuleTree.map(({ id }) => this._lookupStyleDeps(id))
10841082
].flat())
1085-
ret.status = 200
10861083
ret.head = head
10871084
ret.body = `<main>${html}</main>`
1088-
log.debug(`render page '${url.pagePath}' in ${Math.round(performance.now() - start)}ms`)
1085+
if (url.pagePath !== '') {
1086+
log.debug(`render page '${url.pagePath}' in ${Math.round(performance.now() - start)}ms`)
1087+
} else {
1088+
log.warn(`page '${url.pathname}' not found`)
1089+
}
10891090
} catch (err) {
10901091
ret.status = 500
10911092
ret.head = ['<title>500 Error - Aleph.js</title>']

‎renderer.ts

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React, { ComponentType } from 'https://esm.sh/react'
22
import { renderToString } from 'https://esm.sh/react-dom/server'
33
import { DataContext, RouterContext } from './context.ts'
4-
import { E501App, ErrorBoundary } from './error.ts'
4+
import { E404Page, E501App, ErrorBoundary } from './error.ts'
55
import type { PageProps, RouterURL } from './types.ts'
66
import util from './util.ts'
77

@@ -14,17 +14,19 @@ export function renderPage(
1414
pageComponentTree: { id: string, Component?: any }[]
1515
) {
1616
const pageProps: PageProps = {
17-
Page: pageComponentTree[0].Component || (() => null),
17+
Page: pageComponentTree.length > 0 ? pageComponentTree[0].Component || (() => null) : E404Page,
1818
pageProps: {}
1919
}
20-
pageComponentTree.slice(1).reduce((p, m) => {
21-
const c: PageProps = {
22-
Page: m.Component || (() => null),
23-
pageProps: {}
24-
}
25-
p.pageProps = c
26-
return c
27-
}, pageProps)
20+
if (pageComponentTree.length > 1) {
21+
pageComponentTree.slice(1).reduce((p, m) => {
22+
const c = {
23+
Page: m.Component || (() => null),
24+
pageProps: {}
25+
}
26+
p.pageProps = c
27+
return c
28+
}, pageProps)
29+
}
2830
const appEl = App ? (util.isLikelyReactComponent(App) ? React.createElement(App, pageProps) : React.createElement(E501App)) : React.createElement(pageProps.Page, pageProps.pageProps)
2931
return renderToString(
3032
React.createElement(

0 commit comments

Comments
 (0)