Added basic shack creation.

This commit is contained in:
2023-06-03 23:32:50 +02:00
parent bc9fec207b
commit de757efc6e
23 changed files with 274 additions and 216 deletions

View File

@@ -1,35 +1,20 @@
import { renderToString as renderToString_ } from '@vue/server-renderer';
import { escapeInject, dangerouslySkipEscape } from 'vite-plugin-ssr/server';
// import { renderToString as renderToString_ } from '@vue/server-renderer';
import { renderToNodeStream } from '@vue/server-renderer';
import { escapeInject } from 'vite-plugin-ssr/server';
import { createApp } from './app';
import { useUser } from '../stores/user';
import logoUrl from './logo.svg';
async function renderToString(app) {
let err;
// Workaround: renderToString_() swallows errors in production, see https://github.com/vuejs/core/issues/7876
app.config.errorHandler = (err_) => { // eslint-disable-line no-param-reassign
err = err_;
};
const appHtml = await renderToString_(app);
if (err) {
throw err;
}
return appHtml;
}
async function render(pageContext) {
const appHtml = await renderToString(pageContext.app);
// See https://vite-plugin-ssr.com/head
const { documentProps } = pageContext.exports;
const title = (documentProps && documentProps.title) || 'shack';
const desc = (documentProps && documentProps.description) || 'Shack';
const { app, store } = createApp(pageContext);
const stream = renderToNodeStream(app);
const documentHtml = escapeInject`
<!DOCTYPE html>
<html lang="en">
@@ -41,40 +26,26 @@ async function render(pageContext) {
<title>${title}</title>
</head>
<body>
<div id="app">${dangerouslySkipEscape(appHtml)}</div>
<div id="app">${stream}</div>
</body>
</html>
`;
return {
documentHtml,
};
}
async function onBeforeRender(pageContext) {
if (!pageContext.Page) {
throw new Error('My render() hook expects pageContext.Page to be defined');
}
const { app, store } = createApp(pageContext);
const userStore = useUser();
userStore.user = pageContext.session.user;
return {
documentHtml,
pageContext: {
app,
initialState: store.state.value,
pageData: {
user: pageContext.session.user,
},
enableEagerStreaming: true,
},
};
}
export {
render,
onBeforeRender,
};
export const passToClient = ['urlPathname', 'initialState', 'pageData'];
export const passToClient = ['urlPathname', 'initialState', 'pageData', 'pageProps'];

View File

@@ -1,14 +1,24 @@
<template>
<div v-if="is404">
<h1>404 Page Not Found</h1>
<p>This page could not be found.</p>
</div>
<div v-else>
<h1>500 Internal Error</h1>
<p>Something went wrong.</p>
</div>
<div class="content">
<div v-if="is404">
<h1>404 Page Not Found</h1>
<p v-if="errorInfo">{{ errorInfo }}</p>
<p v-else>This page could not be found.</p>
</div>
<div v-else>
<h1>500 Internal Error</h1>
<p v-if="errorInfo">{{ errorInfo }}</p>
<p v-else>Something went wrong.</p>
</div>
</div>
</template>
<script setup>
defineProps(['is404'])
import { usePageContext } from './usePageContext';
const { pageProps } = usePageContext();
const { is404, errorInfo } = pageProps;
</script>

View File

@@ -49,7 +49,7 @@ const { user } = storeToRefs(userStore);
async function logout() {
await del('/api/session');
window.location.reload();
window.location.href = '/account/login';
}
</script>