Skip to content

Latest commit

 

History

History
60 lines (50 loc) · 3.37 KB

README.md

File metadata and controls

60 lines (50 loc) · 3.37 KB
Raw

Template: Svelte client + Express server

File Structure

.
├── *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)

Development

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.

Deployment

Building the Dockerfile compiles the server and client and creates a container to serve both.

Environment Variables

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

Improvement Options

  • Clean up the tsconfigs. 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.