Installation

Get hyperfixi running in your project in under a minute.

Quick Start Options

Option 1: CDN (Fastest)

Add this script tag to your HTML:

<script src="https://unpkg.com/@hyperfixi/core/dist/hyperfixi.js"></script>

Then use hyperscript anywhere:

<button _="on click toggle .active on me">Click me</button>

Option 2: Vite Plugin (Recommended)

The Vite plugin automatically generates minimal bundles based on what commands you actually use.

npm install @hyperfixi/core @hyperfixi/vite-plugin

// vite.config.js
import { hyperfixi } from '@hyperfixi/vite-plugin';

export default {
  plugins: [hyperfixi()],
};

// main.js
import 'hyperfixi';

That's it. The plugin scans your files and includes only the commands you need.

Option 3: npm (Manual Setup)

npm install @hyperfixi/core

import { register, everything, boot, evaluate } from '@hyperfixi/core';

// Add the grammar: every module, or only the ones a page needs
register(...everything);

// Install as window._hyperscript and process every _="..." attribute
boot();

// Or run hyperscript programmatically
evaluate('toggle .active on me', { me: element });

The package root is @hyperfixi/engine, re-exported (ESM only). A command whose
module is not registered does not exist: a script that uses it fails to parse.

Verify Installation

Add this to your HTML:

<button _="on click put 'It works!' into the next <div/>">Test hyperfixi</button>
<div>Click the button</div>

Click the button. If the text changes, you're all set.

Next Steps

Suggest a change to this page