-
Notifications
You must be signed in to change notification settings - Fork 0
1. First Web App (Vite)
NotElementImport edited this page Nov 12, 2024
·
5 revisions
To create your first application, it is better to use vite. Fast build under prod, and support for typescript during development
We'll use the vanilla-ts template
npm create vite@latest horizon-app -- --template vanilla-tsGo to the directory
cd horizon-appInstall dependencies
npm i;
npm i horizon-core
Go to src/main.ts and edit file
import { defineApp } from "horizon-core";
import { comp } from "horizon-core/component";
import { useSignal } from "horizon-core/state";
const app = defineApp()
const mainComponent = comp((_, { text, $ }) => {
const counter = useSignal(
0, { asRaw: value => `Counter: ${value}` }
)
$('button', {
'@click': () => counter.value++
}, () => {
text(counter)
})
})
mainComponent.composable.dom = document.body.querySelector('#app')
?? document.body
app.renderDOM(app, mainComponent)npm run devnpm run build;
npm run previewsee also Creating component