From 5dd2079cd4fcedc6b38ae97bd59eb98d4ec5ca2f Mon Sep 17 00:00:00 2001 From: Ben Merckx Date: Mon, 11 Nov 2024 13:55:12 +0530 Subject: [PATCH] Bundle both config and views in one entrypoint in dev mode --- src/cli/generate/CopyStaticFiles.ts | 1 - src/cli/serve/CreateLocalServer.ts | 12 ++++++++---- src/cli/static/dashboard/dev.js | 12 +++--------- src/dashboard/dev/DevDashboard.tsx | 17 ++++++++--------- 4 files changed, 19 insertions(+), 23 deletions(-) diff --git a/src/cli/generate/CopyStaticFiles.ts b/src/cli/generate/CopyStaticFiles.ts index 30a3422e..9b19ae33 100644 --- a/src/cli/generate/CopyStaticFiles.ts +++ b/src/cli/generate/CopyStaticFiles.ts @@ -23,7 +23,6 @@ export async function copyStaticFiles({outDir}: GenerateContext) { path.join(outDir, 'package.json'), JSON.stringify(packageJson, null, 2) ) - await writeFileIfContentsDiffer(path.join(outDir, 'views.css'), ``) // await writeFileIfContentsDiffer(path.join(outDir, '.gitignore'), `*\n!.keep`)*/ await writeFileIfContentsDiffer( path.join(outDir, '.keep'), diff --git a/src/cli/serve/CreateLocalServer.ts b/src/cli/serve/CreateLocalServer.ts index b1bb1274..6a9f884a 100644 --- a/src/cli/serve/CreateLocalServer.ts +++ b/src/cli/serve/CreateLocalServer.ts @@ -92,8 +92,7 @@ export function createLocalServer( const matcher = router.matcher() const entryPoints = { entry: 'alinea/cli/static/dashboard/dev', - config: configLocation, - views: viewsPlugin.entry + config: '#alinea/entry' } const tsconfigLocation = path.join(rootDir, 'tsconfig.json') const tsconfig = fs.existsSync(tsconfigLocation) @@ -118,7 +117,12 @@ export function createLocalServer( ...buildOptions, plugins, alias: { - 'alinea/next': 'alinea/core' + 'alinea/next': 'alinea/core', + '#alinea/config': configLocation, + '#alinea/entry': `data:text/javascript, + export * from '#alinea/config' + export * from '${viewsPlugin.entry}' + ` }, external: ['@alinea/generated'], inject: ['alinea/cli/util/WarnPublicEnv'], @@ -217,7 +221,7 @@ export function createLocalServer( ` - + diff --git a/src/cli/static/dashboard/dev.js b/src/cli/static/dashboard/dev.js index e17b10e0..13132a89 100644 --- a/src/cli/static/dashboard/dev.js +++ b/src/cli/static/dashboard/dev.js @@ -7,16 +7,10 @@ const element = scripts[scripts.length - 1] const into = document.createElement('div') into.id = 'root' element.parentElement.replaceChild(into, element) -reactRender(jsx(DevDashboard, {loadConfig, loadViews}), into) +reactRender(jsx(DevDashboard, {loadConfig}), into) async function loadConfig() { const exports = await import('/config.js?' + Math.random()) - if ('cms' in exports) return exports.cms.config - throw new Error(`No config found in "/config.js"`) -} - -async function loadViews() { - const exports = await import('/views.js?' + Math.random()) - if ('views' in exports) return exports.views - throw new Error(`No views found in "/views.js"`) + if (!('cms' in exports)) throw new Error(`No config found in "/config.js"`) + return exports } diff --git a/src/dashboard/dev/DevDashboard.tsx b/src/dashboard/dev/DevDashboard.tsx index da56e63b..53756fcd 100644 --- a/src/dashboard/dev/DevDashboard.tsx +++ b/src/dashboard/dev/DevDashboard.tsx @@ -1,5 +1,5 @@ import {Client} from 'alinea/core/Client' -import {Config} from 'alinea/core/Config' +import {CMS} from 'alinea/core/CMS' import {useSetAtom} from 'jotai' import {ComponentType, useEffect, useState} from 'react' import {QueryClient} from 'react-query' @@ -34,31 +34,30 @@ function setupDevReload({refresh, refetch, open, close}: DevReloadOptions) { } export type DevDashboardOptions = { - loadConfig: () => Promise - loadViews: () => Promise> + loadConfig: () => Promise<{cms: CMS; views: Record}> } const queryClient = new QueryClient({defaultOptions: {queries: {retry: false}}}) -export function DevDashboard({loadConfig, loadViews}: DevDashboardOptions) { +export function DevDashboard({loadConfig}: DevDashboardOptions) { const [app, setApp] = useState() const [connected, setConnected] = useState(true) const forceDbUpdate = useSetAtom(dbUpdateAtom) async function getConfig() { // Reload css const link = document.querySelector( - 'link[href^="/views.css"]' + 'link[href^="/config.css"]' ) as HTMLLinkElement const copy = link.cloneNode() as HTMLLinkElement - copy.href = '/views.css?' + Math.random() + copy.href = '/config.css?' + Math.random() copy.onload = () => link.remove() link.after(copy) - const [config, views] = await Promise.all([loadConfig(), loadViews()]) + const config = await loadConfig() const client = new Client({ - config, + config: config.cms, url: new URL('/api', location.href).href }) - return setApp({config, views, client}) + return setApp({config: config.cms.config, views: config.views, client}) } useEffect(() => { getConfig()