defuss

Vite plugin

defuss is a simple, tiny and modern web framework. It stops complexity, promotes explicit code, and brings back the joy of building for the web! 😊

💡 Can you imagine? The whole Vite plugin including it's custom defuss/render integration is written in only ~160 Lines of Code.

This package brings the defuss experience to any Vite project.

How to integrate defuss in an existing Vite project?

🚀 Looking for a template to start from? examples/with-vite-ts is a Vite project pre-configured to work with defuss out-of-the-box.

You're just two steps away from success:

1. Install defuss-vite:

# install a decent package manager
npm i -g pnpm@^9.13.2

# from your project root folder, add defuss-vite to the devDependencies
npm install --save-dev defuss-vite

2. Add defuss-vite to your config:

Create or edit: vite.config.mjs or vite.config.ts:

import { defineConfig } from 'vite';

// import the defuss plugin
import defuss from "defuss-vite"

export default defineConfig({
  // add the defuss() plugin to make JSX transpilation work
  plugins: [defuss()]
});

🚀 How does defuss-vite work?

Inside this package, you'll find the following relevant folders and files:

/
├── src/index.ts
├── src/types.ts
├── package.json

🧞 Commands

All commands are run from the root of the project, from a terminal:

| Command | Action | | :------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | npm build | Build a new version of the plugin. | | npm publish | Publish a new version of the defuss-vite integration package. |