adex

An easier way to build apps with Vite and Preact

• adex
  • About
    • Highlights
  • Setup
  • Docs
  • License

About

adex is just a vite plugin that adds in the required functionality to be able to build server rendered preact apps.

Highlights

• Unified routing for both backend and frontend
• Tiny and Simple
• Builds on existing tooling instead of adding yet another way to do things

Setup

As there are a few steps needed to get it running, it's not recommended to do this manually, instead use the existing template to get started

If you still wish to set it up manually.

Create a preact based vite app

npm create vite@latest -- -t preact

Add in the required deps

npm add -D adex

Modify config to use adex

// vite.config.js
import { defineConfig } from 'vite'
import preact from '@preact/preset-vite'
+ import { adex } from 'adex'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
+   adex(),
    preact()],
})

Remove the default preact files and add in basic structure for adex

rm -rf ./src/* index.html
mkdir -p src/pages src/api
touch src/global.css

And you are done.

Docs

Docs →

License

MIT