From 1a76019f1e4abe5b75f4ee46b34213f406427064 Mon Sep 17 00:00:00 2001 From: Bhasher Date: Thu, 11 Jan 2024 16:32:48 +0100 Subject: [PATCH] SvelteKit static adapter --- frontend/Dockerfile | 16 ++++--- frontend/package-lock.json | 21 ++------- frontend/package.json | 2 +- frontend/run.sh | 5 +++ .../components/projects/SelectProject.svelte | 4 +- frontend/src/lib/utils/api.ts | 5 ++- frontend/src/routes/+layout.js | 1 + frontend/src/routes/+page.js | 1 - frontend/src/routes/manifest.json/+server.ts | 45 ------------------- .../project/{[project] => }/+page.svelte | 5 +-- frontend/static/manifest.json | 13 ++++++ frontend/svelte.config.js | 2 +- 12 files changed, 42 insertions(+), 78 deletions(-) create mode 100644 frontend/run.sh create mode 100644 frontend/src/routes/+layout.js delete mode 100644 frontend/src/routes/+page.js delete mode 100644 frontend/src/routes/manifest.json/+server.ts rename frontend/src/routes/project/{[project] => }/+page.svelte (91%) create mode 100644 frontend/static/manifest.json diff --git a/frontend/Dockerfile b/frontend/Dockerfile index 1dd30de..fde37eb 100644 --- a/frontend/Dockerfile +++ b/frontend/Dockerfile @@ -2,17 +2,21 @@ FROM node:20 as frontend-builder WORKDIR /app -COPY . . - +COPY package.json . +COPY package-lock.json . RUN npm install + +COPY . . RUN npm run build -FROM node:20-alpine +FROM nginx:alpine -COPY --from=frontend-builder /app . +COPY --from=frontend-builder /app/build /usr/share/nginx/html +COPY run.sh . +RUN chmod +x run.sh -EXPOSE 4173 +EXPOSE 80 ENV PUBLIC_BACKEND_URL=http://localhost:3000 -CMD ["npm", "run", "preview", "--", "--port", "4173", "--host", "0.0.0.0"] +CMD ["./run.sh"] diff --git a/frontend/package-lock.json b/frontend/package-lock.json index e9b537a..46add6c 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -15,7 +15,7 @@ }, "devDependencies": { "@playwright/test": "^1.28.1", - "@sveltejs/adapter-auto": "^3.0.0", + "@sveltejs/adapter-static": "^3.0.1", "@sveltejs/kit": "^2.0.0", "@sveltejs/vite-plugin-svelte": "^3.0.0", "@types/eslint": "8.56.0", @@ -824,14 +824,11 @@ "win32" ] }, - "node_modules/@sveltejs/adapter-auto": { + "node_modules/@sveltejs/adapter-static": { "version": "3.0.1", - "resolved": "https://registry.npmjs.org/@sveltejs/adapter-auto/-/adapter-auto-3.0.1.tgz", - "integrity": "sha512-OpilmvRN136lUgOa9F0zpSI6g+PouOmk+YvJQrB+/hAtllLghjjYuoyfUsrF7U6oJ52cxCtAJTPXgZdyyCffrQ==", + "resolved": "https://registry.npmjs.org/@sveltejs/adapter-static/-/adapter-static-3.0.1.tgz", + "integrity": "sha512-6lMvf7xYEJ+oGeR5L8DFJJrowkefTK6ZgA4JiMqoClMkKq0s6yvsd3FZfCFvX1fQ0tpCD7fkuRVHsnUVgsHyNg==", "dev": true, - "dependencies": { - "import-meta-resolve": "^4.0.0" - }, "peerDependencies": { "@sveltejs/kit": "^2.0.0" } @@ -2242,16 +2239,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/import-meta-resolve": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.0.0.tgz", - "integrity": "sha512-okYUR7ZQPH+efeuMJGlq4f8ubUgO50kByRPyt/Cy1Io4PSRsPjxME+YlVaCOx+NIToW7hCsZNFJyTPFFKepRSA==", - "dev": true, - "funding": { - "type": "github", - "url": "https://github.com/sponsors/wooorm" - } - }, "node_modules/imurmurhash": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz", diff --git a/frontend/package.json b/frontend/package.json index 354cac9..fc93d40 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -15,7 +15,7 @@ }, "devDependencies": { "@playwright/test": "^1.28.1", - "@sveltejs/adapter-auto": "^3.0.0", + "@sveltejs/adapter-static": "^3.0.1", "@sveltejs/kit": "^2.0.0", "@sveltejs/vite-plugin-svelte": "^3.0.0", "@types/eslint": "8.56.0", diff --git a/frontend/run.sh b/frontend/run.sh new file mode 100644 index 0000000..69e09df --- /dev/null +++ b/frontend/run.sh @@ -0,0 +1,5 @@ +PUBLIC_BACKEND_URL=${PUBLIC_BACKEND_URL:-http://localhost:3000} + +find /usr/share/nginx/html -type f -exec sed -i "s|http://localhost:3000|$PUBLIC_BACKEND_URL|g" {} + + +nginx -g 'daemon off;' diff --git a/frontend/src/lib/components/projects/SelectProject.svelte b/frontend/src/lib/components/projects/SelectProject.svelte index ac5f114..b7bf779 100644 --- a/frontend/src/lib/components/projects/SelectProject.svelte +++ b/frontend/src/lib/components/projects/SelectProject.svelte @@ -40,10 +40,10 @@ {:else}
(location.href = `/project/${project.id}`)} + on:click={() => (location.href = `/project.html?id=${project.id}`)} on:keydown={(e) => { if (e.key === 'Enter') { - location.href = `/project/${project.id}`; + location.href = `/project?id=${project.id}`; } }} tabindex="0" diff --git a/frontend/src/lib/utils/api.ts b/frontend/src/lib/utils/api.ts index 5e2a12f..b658871 100644 --- a/frontend/src/lib/utils/api.ts +++ b/frontend/src/lib/utils/api.ts @@ -1,9 +1,10 @@ import axios, { Axios, type AxiosResponse } from 'axios'; import { toastAlert } from './toasts'; import { setupCache } from 'axios-cache-interceptor'; -import { env } from '$env/dynamic/public'; +// import { env } from '$env/dynamic/public'; -const backend = env.PUBLIC_BACKEND_URL || 'http://localhost:3000'; +// const backend = env.PUBLIC_BACKEND_URL || 'http://localhost:3000'; +const backend = 'http://localhost:3000'; export default setupCache( new Axios({ diff --git a/frontend/src/routes/+layout.js b/frontend/src/routes/+layout.js new file mode 100644 index 0000000..189f71e --- /dev/null +++ b/frontend/src/routes/+layout.js @@ -0,0 +1 @@ +export const prerender = true; diff --git a/frontend/src/routes/+page.js b/frontend/src/routes/+page.js deleted file mode 100644 index a3d1578..0000000 --- a/frontend/src/routes/+page.js +++ /dev/null @@ -1 +0,0 @@ -export const ssr = false; diff --git a/frontend/src/routes/manifest.json/+server.ts b/frontend/src/routes/manifest.json/+server.ts deleted file mode 100644 index f073071..0000000 --- a/frontend/src/routes/manifest.json/+server.ts +++ /dev/null @@ -1,45 +0,0 @@ -import projectsApi from '$lib/api/projectsApi'; - -interface Shortcut { - name: string; - description: string; - url: string; - icons: { - src: string; - sizes: string; - }[]; -} - -export async function GET() { - const icon = { - src: '/img/icon.svg', - type: 'image/svg+xml', - sizes: 'any' - }; - - const projects = await projectsApi.getAll(); - - const shortcuts: Shortcut[] = projects.map((project) => { - return { - name: `Project ${project.title}`, - description: `Shortcut for project ${project.title}`, - url: `/${project.id}`, - icons: [icon] - }; - }); - - const manifest = { - short_name: 'Focus', - name: 'Focus', - start_url: '/', - display: 'standalone', - icons: [icon], - shortcuts - }; - - return new Response(JSON.stringify(manifest), { - headers: { - 'Content-Type': 'application/manifest+json' - } - }); -} diff --git a/frontend/src/routes/project/[project]/+page.svelte b/frontend/src/routes/project/+page.svelte similarity index 91% rename from frontend/src/routes/project/[project]/+page.svelte rename to frontend/src/routes/project/+page.svelte index ddddb6f..3e24fa5 100644 --- a/frontend/src/routes/project/[project]/+page.svelte +++ b/frontend/src/routes/project/+page.svelte @@ -1,17 +1,16 @@