Installation
All PicMo packages are available on the NPM registry, and are also distributed as UMD modules which can be added to any site with a simple <script>
tag. Resources can be served locally or loaded from a CDN.
Using the UMD distributions
The UMD distributions for each module will expose a global object containing all of the same exports that are included in the NPM package.
The add-on packages include picmo
as a peer dependency - it is not bundled with them. In an npm project, you will need to install picmo
along with any add-on packages. When using the UMD distributions, the main picmo
module must be loaded first since the other modules reference it by its global name picmo
.
Using the ESM distributions from the browser
If your browser supports ES Modules, you can import PicMo or its add-ons with an import statement in a JavaScript file. This file must be added with a script
tag with type
set to module
.
picmo
From NPM
- NPM
- Yarn
npm install picmo
yarn add picmo
From a CDN (UMD)
The UMD for picmo
exposes a global picmo
object containing all exports.
- unpkg
- jsDelivr
<script src="https://unpkg.com/picmo@latest/dist/umd/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/picmo@latest/dist/umd/index.js"></script>
From a CDN (ESM)
- unpkg
- jsDelivr
import { createPicker } from 'https://unpkg.com/picmo@latest/dist/index.js';
import { createPicker } from 'https://cdn.jsdelivr.net/npm/picmo@latest/dist/index.js';
@picmo/popup-picker
From NPM
- NPM
- Yarn
npm install @picmo/popup-picker
yarn add @picmo/popup-picker
From a CDN (UMD)
The UMD for @picmo/popup-picker
exposes a global picmoPopup
object containing all exports.
- unpkg
- jsDelivr
<script src="https://unpkg.com/@picmo/popup-picker@latest/dist/umd/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@picmo/popup-picker@latest/dist/umd/index.js"></script>
From a CDN (ESM)
- unpkg
- jsDelivr
import { createPopup } from 'https://unpkg.com/@picmo/popup-picker@latest/dist/index.js?module';
import { createPopup } from 'https://cdn.jsdelivr.net/npm/@picmo/popup-picker@latest/dist/index.js';
@picmo/renderer-twemoji
From NPM
- NPM
- Yarn
npm install @picmo/renderer-twemoji
yarn add @picmo/renderer-twemoji
From a CDN (UMD)
The UMD for @picmo/renderer-twemoji
exposes a global picmoTwemoji
object containing all exports.
- unpkg
- jsDelivr
<script src="https://unpkg.com/@picmo/renderer-twemoji@latest/dist/umd/index.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@picmo/renderer-twemoji@latest/dist/umd/index.js"></script>
From a CDN (ESM)
- unpkg
- jsDelivr
import { TwemojiRenderer } from 'https://unpkg.com/@picmo/renderer-twemoji@latest/dist/index.js?module';
import { TwemojiRenderer } from 'https://cdn.jsdelivr.net/npm/@picmo/renderer-twemoji@latest/dist/index.js';