Installation
Unpoly is one JavaScript file and one CSS file that you load in your <head>.
It has no dependencies and needs no build step.
Compressed with gzip, the JavaScript weighs 59.7 KB and the CSS 1.1 KB.
Unpoly works with any language and any web framework. Your backend keeps rendering HTML and needs no additional software. Static sites work, too.
Loading Unpoly from a CDN
For a quick test drive, load both files from a CDN. Include them before your own JavaScripts and stylesheets:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/unpoly@3.15.0/unpoly.css"> <!-- mark-line -->
<script src="https://cdn.jsdelivr.net/npm/unpoly@3.15.0/unpoly.js" defer></script> <!-- mark-line -->
<link rel="stylesheet" href="your-styles.css" />
<script src="your-scripts.js" defer></script>
</head>
<body>
<!-- Use Unpoly attributes in your HTML -->
<a href="/page" up-follow>Go to page</a> <!-- mark: up-follow -->
</body>
</html>
Unpoly initializes on DOMContentLoaded
and enhances the HTML on your page. This is all you need to use Unpoly attributes,
like the [up-follow] link above. Other installation methods, like npm, are explained below.
Installing from npm
To make Unpoly a permanent part of your app, you can install it as an npm package:
npm install unpoly --save
Now import Unpoly before your own JavaScripts and stylesheets:
import 'unpoly/unpoly.js' // mark-line
import 'unpoly/unpoly.css' // mark-line
import './your-scripts.js'
import './your-styles.css'
Your own code then accesses Unpoly's JavaScript API through the window.up global,
without an explicit import.
Optional extensions
You now have everything you need to start using Unpoly. For special needs, there are optional extensions:
- Server protocol: Inspect or manipulate Unpoly's rendering through HTTP headers.
- Legacy browser support: Builds for old browsers and build tools.
- Bootstrap integration: Configure Unpoly to use Bootstrap's CSS classes.
- Upgrade shim: Polyfills for deprecated Unpoly APIs.
Docs for coding agents
Coding agents work better with Unpoly when they read its documentation instead of guessing. Install the docs as an agent skill:
npx skills add --global https://unpoly.com
The skill page has other ways to install the skill, and shows how to use the docs in an AI chat.