.
├── *build generated by `npm run build` (.gitignore)
│ ├── client
│ │ ├── assets
│ │ │ └── * compiled js (& sourcemap), css and files from `src/client/assets` (with hash)
│ │ ├── index.html transformed html by vite
│ │ └── * files from `src/client/public` (plain copy)
│ └── server
│ ├── server.js server entry point
│ └── * compiled server code
│
├── src
│ ├── client
│ │ ├── assets
│ │ │ └── * static assets (importable)
│ │ ├── public
│ │ │ └── * static assets (copied to root dir)
│ │ ├── components
│ │ │ └── *.svelte Svelte components
│ │ ├── main.ts Svelte entrypoint
│ │ ├── App.svelte main Svelte component
│ │ └── app.css global CSS (mainly css reset)
│ └── server
│ ├── server.ts server entry point (also sets up vite middleware in dev mode)
│ └── * server code
│
├── *.env environment variables
├── .gitignore
├── Dockerfile
├── index.html vite entrypoint
├── package.json
├── *package-lock.json
├── README.md
├── tsconfig.json
├── tsconfig.vite.json vite-specific tsconfig (referenced in tsconfig.json)
├── tsconfig.server.json server-specific tsconfig
└── vite.config.js vite config (js so that the server can import it for middleware without compiling)
npm run dev
starts watching the server with tsc and starts the server with the vite middleware which watches the client directory and serves it with HMR.
Building the Dockerfile compiles the server and client and creates a container to serve both.
Variable | Default Value | Description |
---|---|---|
PORT |
8080 |
Port to serve the server on |
NODE_ENV |
production |
production : Serve static files from ./build/client development : Use vite middleware for HMR instead |
tsconfig.json
and tsconfig.vite.json
are from the svelte-vite template and tsconfig.server.json
is for my express server because I don't understand TypeScript Project References enough to mess with it. But I bet those files can be structured better.