When I run my Svelte app in the preview, it works fine, but as soon as I build it, the load function is no longer executed. To make sure, invalidateAll
is executed every second for testing, this also no longer works in the app after building, but does in the preview.
the code of the pages shown:
export let data: PageData;onMount(() => { const interval = setInterval(() => { invalidateAll(); }, 1000); return () => { clearInterval(interval); };});$: console.log(data.ServerMessage);
The code from +page.server.ts
in the same folder
let runsLoad = 0;export const load: PageServerLoad = async () => { let runs = 0; let itemList: Coffee[] = []; try { console.log('load data from Server'); [itemList, runs] = await getAllCoffees(); } catch (error) { console.error(error); } return { coffeeList: itemList, ServerMessage: 'Load runs: '+++runsLoad +' Query runs:'+ runs };};
and the code that is currently in another folder in a file called DB.ts.
let runs = 0;// ----- connection functions ----- //export const pool = mariadb.createPool({ host: DB_HOST || 'localhost', user: DB_USER || 'root', password: DB_PASSWORD || 'ADMIN', database: DB_NAME || 'coffeeCloudDB', port: Number(MARIADB_DOCKER_PORT) || 3306, connectionLimit: 5});// ----- Helper functions ----- //async function queryDB(query: string) { let conn; try { conn = await pool.getConnection(); const rows = await conn.query(query); // console.log('queryDB rows:', rows); return rows; } catch (err) { throw err; } finally { if (conn) conn.end(); }}// ----- exporter functions ----- //export async function getAllCoffees(): Promise<[Coffee[], number]> { const query = ` SELECT c.id, c.coffee_name as name, c.description, false as favorite FROM CoffeeCloudDB.coffees as c `; let rows_return: Coffee[] = []; await queryDB(query).then((rows) => { rows_return = rows; });++runs; return [rows_return, runs];}
ave also tried to name DB file +page.server.ts
but without success.
Here is an example image, where on the left in the console of the preview you can see how the couter counts up, while on the right you can see the web page after using yarn build
and node build
. I have also inserted a new entry in the DB, which can be seen in the preview on the left, but is unfortunately not loaded on the right.
I use the node-adapter, for the svelte app in the svelte.config.js
import adapter from '@sveltejs/adapter-node';import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';/** @type {import('@sveltejs/kit').Config} */const config = { preprocess: vitePreprocess(), kit: { env: { dir: './' }, adapter: adapter() }};export default config;
Additionally the vite.config.ts
:
import { sveltekit } from '@sveltejs/kit/vite';import { defineConfig } from 'vite';export default defineConfig({ plugins: [sveltekit()], define: {'process.env': process.env }});
and the package.json
:
{"name": "coffeecloud","version": "0.0.1","scripts": {"dev": "vite dev","dev:with-host": "vite dev --host","build": "vite build","preview": "vite preview","test": "playwright test","check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json","check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch","lint": "prettier --check . && eslint .","format": "prettier --write ." },"devDependencies": {"@fontsource/fira-mono": "^5.1.0","@neoconfetti/svelte": "^2.2.1","@playwright/test": "^1.48.0","@skeletonlabs/skeleton": "^2.10.2","@skeletonlabs/tw-plugin": "^0.4.0","@sveltejs/adapter-auto": "^3.2.5","@sveltejs/adapter-node": "^5.2.9","@sveltejs/kit": "^2.7.0","@sveltejs/vite-plugin-svelte": "^3.1.2","@tailwindcss/aspect-ratio": "^0.4.2","@tailwindcss/typography": "^0.5.15","@testing-library/jest-dom": "^6.5.0","@testing-library/svelte": "^5.2.3","@types/d3-color": "^3.1.3","@types/d3-scale": "^4.0.8","@types/eslint": "^9.6.1","@types/jest": "^29.5.13","@types/node": "^22.7.5","@vitest/ui": "^2.0.5","autoprefixer": "^10.4.20","eslint": "^9.12.0","eslint-config-prettier": "^9.1.0","eslint-plugin-svelte": "^2.44.1","globals": "^15.11.0","jsdom": "^25.0.1","prettier": "^3.3.3","prettier-plugin-svelte": "^3.2.7","prettier-plugin-tailwindcss": "^0.6.8","svelte": "^4.2.19","svelte-check": "^3.8.6","tailwindcss": "^3.4.13","ts-node": "^10.9.2","typescript": "^5.6.3","typescript-eslint": "^8.8.1","vite": "^5.4.8","vitest": "^2.0.5" },"type": "module","dependencies": {"d3": "^7.9.0","d3-array": "^3.2.4","d3-color": "^3.1.0","d3-hierarchy": "^3.1.2","d3-scale": "^4.0.2","d3-scale-chromatic": "^3.1.0","layerchart": "^0.51.2","mariadb": "^3.4.0","mysql2": "^3.11.3","svelte-awesome-slider": "^1.1.2","svelte-ux": "^0.74.9","text-encoding-polyfill": "^0.6.7" }}