- Notifications
You must be signed in to change notification settings - Fork6
mujahidfa/preact-htm-signals-standalone
Folders and files
| Name | Name | Last commit message | Last commit date | |
|---|---|---|---|---|
Repository files navigation
A single, standalone version ofPreact,HTM andPreact Signals. No external dependencies, just one single file.
One single file that you can use viaCDN ordownload locally for offline use.
<divid="app"></div><scripttype="module">import{html,render,signal,}from"https://cdn.jsdelivr.net/npm/preact-htm-signals-standalone/dist/standalone.js";constcount=signal(0);functionApp(){returnhtml`<div><h1class>Hello World!</h1><buttononClick=${()=>(count.value+=1)}> Increment with signal</button><p>Counter:${count}</p></div> `;}render(html`<${App}/>`,document.getElementById("app"));</script>
I don't recommend installing this package via NPM. It's best to installPreact,HTM andPreact Signals separately:
npm install preact htm @preact/signals# or yarnyarn add preact htm @preact/signals# or pnpmpnpm install preact htm @preact/signals
My main motivation is to be able to download the entirety of Preact + HTM + Preact Signals offline in a single file.
You can absolutely do the following (and it works fine):
<scripttype="module">import{h,render}from"https://cdn.skypack.dev/preact";importhtmfrom"https://cdn.skypack.dev/htm";import{signal}from"https://cdn.skypack.dev/@preact/signals";consthtml=htm.bind(h);</script>
or go shorter and do this:
<scripttype="module">import{html,render}from"https://esm.sh/htm/preact";import{signal}from"https://esm.sh/@preact/signals";</script>
or even shorter (vianpm.reversehttp.com, thanksJason Miller for the tool!):
<scripttype="module">import{html,render,signal,}from"https://npm.reversehttp.com/preact,htm/preact,@preact/signals";</script>
However, due to my work limitations (i.e. my internal Preact apps run on restricted corp intranet), having a downloadable, offline version is required, hence the need for a prebundled, no-dependency, single script that I can easily download and use offline.
Simply put, my ideal situation looks like this (made possible by this project):
<scripttype="module">// Download the prebundled scripts locally for offline useimport{html,render,signal}from"./preact-htm-signals-standalone.js";</script>
Inspired by thestandalone version of Preact + HTM.
All rights belong toPreact,HTM andPreact Signals owners/maintainers.
Install and bundle them (viaMicrobundle):
git clone https://github.com/mujahidfa/preact-htm-signals-standalone.gitcd preact-htm-signals-standalonepnpm ipnpm bundlenpm publish --dry-run# to test out publishing to npmnpm publish
About
A single, standalone version of Preact, HTM and Preact Signals. No external dependencies, just one single file.
Resources
Uh oh!
There was an error while loading.Please reload this page.
Stars
Watchers
Forks
Packages0
Uh oh!
There was an error while loading.Please reload this page.