sim1222/twemoji
1
0
Fork 0
mirror of https://github.com/twitter/twemoji.git synced 2025-04-29 10:57:29 +09:00
Code Issues Projects Releases Wiki Activity

CDN: Migrate MaxCDN/Cloudflare/unpkg to jsDelivr

Browse Source
This commit is contained in:
Justine De Caires 2023-01-10 13:50:05 -06:00
parent f4e653936f
commit 87d7f73611
9 changed files with 17 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
LEGACY.md
View File

@ -4,15 +4,11 @@
### CDN Support ### CDN Support
The folks over at [MaxCDN](https://www.maxcdn.com) have graciously provided CDN support. Previously, MaxCDN provided support for V1 of the Twemoji API. MaxCDN shut down on December 31, 2022.
Use the following in the `<head>` tag of your HTML document(s): Support for V1 of the Twemoji API is no longer available and is not planned. Please migrate to V2.
```html The rest of this README is kept around for historical purposes and may not work as described.
<script src="https://twemoji.maxcdn.com/1/twemoji.min.js" crossorigin="anonymous"></script>
```
This guarantees that you are using the V1 version of the library.
### Download ### Download

14
README.md
View File

@ -10,21 +10,19 @@ The Twemoji library offers support for all Unicode-defined emoji which are recom
### CDN Support ### CDN Support
<del>The folks over at [MaxCDN](https://www.maxcdn.com) have graciously provided CDN support.</del> Default CDN support is provided via [jsDelivr](https://www.jsdelivr.com/).
MaxCDN is shut down right now, so in the meanwhile use a different CDN or download the assets. (See [Maxcdn has shut down, cdn not working anymore. · Issue #580 · twitter/twemoji](https://github.com/twitter/twemoji/issues/580)).
Use the following in the `<head>` tag of your HTML document(s): Use the following in the `<head>` tag of your HTML document(s):
```html ```html
<script src="https://unpkg.com/twemoji@latest/dist/twemoji.min.js" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/@twemoji/api@latest/dist/twemoji.min.js" crossorigin="anonymous"></script>
``` ```
This guarantees that you will always use the latest version of the library. This guarantees that you will always use the latest version of the library.
If, instead, you'd like to include the latest version explicitly, you can add the following tag: If, instead, you'd like to include the latest version explicitly, you can add the following tag:
```html ```html
<script src="https://unpkg.com/twemoji@14.0.2/dist/twemoji.min.js" integrity="sha384-ICOlZarapRIX6UjKPcWKEpubjg7lGADN7Y9fYP4DU9zm0aPFhgnP5ef+XFaPyKv+" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/@twemoji/api@14.1.0/dist/twemoji.min.js" integrity="sha384-A0m5nIzznesp6GyoeuDVkJ6nUu+of5PywoXYoq3x+KVE2jxUSoHvftqkR5bA9W7Y" crossorigin="anonymous"></script>
``` ```
### Download ### Download
@ -61,7 +59,7 @@ var img = div.querySelector('img');
// note the div is preserved // note the div is preserved
img.parentNode === div; // true img.parentNode === div; // true
img.src; // https://twemoji.maxcdn.com/v/latest/72x72/2764.png img.src; // https://cdn.jsdelivr.net/gh/twitter/twemoji@latest/assets/72x72/2764.png
img.alt; // \u2764\uFE0F img.alt; // \u2764\uFE0F
img.className; // emoji img.className; // emoji
img.draggable; // false img.draggable; // false
@ -78,7 +76,7 @@ Here's the list of properties accepted by the optional object that can be passed
{ {
callback: Function, // default the common replacer callback: Function, // default the common replacer
attributes: Function, // default returns {} attributes: Function, // default returns {}
base: string, // default MaxCDN base: string, // default jsDelivr
ext: string, // default ".png" ext: string, // default ".png"
className: string, // default "emoji" className: string, // default "emoji"
size: string|number, // default "72x72" size: string|number, // default "72x72"
@ -136,7 +134,7 @@ twemoji.parse(genericNode, {
}); });
``` ```
This will generate urls such `https://twemoji.maxcdn.com/svg/2764.svg` instead of using a specific size based image. This will generate urls such `https://cdn.jsdelivr.net/gh/twitter/twemoji@latest/assets/svg/2764.svg` instead of using a specific size based image.
## Utilities ## Utilities

2
index.d.ts vendored
View File

@ -13,7 +13,7 @@ export type ReplacerFunction = (substring: string, ...args: any[]) => string;
export type TwemojiOptions = { export type TwemojiOptions = {
/** /**
* Default: Cloudflare * Default: jsDelivr
*/ */
base?: string; base?: string;
/** /**

2
index.html
View File

@ -44,7 +44,7 @@
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script> <script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
<p>Code licensed under MIT. Graphics licensed under CC-BY</p> <p>Code licensed under MIT. Graphics licensed under CC-BY</p>
<script src="https://unpkg.com/twemoji@latest/dist/twemoji.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/@twemoji/api@latest/dist/twemoji.min.js"></script>
<script> <script>
// I \u2764 emoji! // I \u2764 emoji!
twemoji.parse(document.body); twemoji.parse(document.body);

4
scripts/build.js
View File

@ -46,8 +46,8 @@ function createTwemoji() {
// properties // // properties //
///////////////////////// /////////////////////////
// default assets url, by default will be Twitter Inc. CDN // default assets url, by default will be jsDelivr CDN
base: 'https://cdnjs.cloudflare.com/ajax/libs/twemoji/$VERSION/', base: 'https://cdn.jsdelivr.net/gh/twitter/twemoji@$VERSION/assets/',
// default assets file extensions, by default '.png' // default assets file extensions, by default '.png'
ext: '.png', ext: '.png',

2
scripts/create-dist
View File

@ -60,7 +60,7 @@ const integrityHash = getIntegrityHash(distFile('twemoji.min.js'));
const { version } = require('../package.json'); const { version } = require('../package.json');
function updateSriScriptReference(filename) { function updateSriScriptReference(filename) {
const newScript = `<script src="https://unpkg.com/twemoji@${version}/dist/twemoji.min.js" integrity="${integrityHash}"`; const newScript = `<script src="https://cdn.jsdelivr.net/npm/@twemoji/api@${version}/dist/twemoji.min.js integrity="${integrityHash}"`;
fs.writeFileSync(filename, fs.readFileSync(filename).toString('utf8').replace(/<script src="[^ ]*" integrity="[^ ]*"/, newScript)); fs.writeFileSync(filename, fs.readFileSync(filename).toString('utf8').replace(/<script src="[^ ]*" integrity="[^ ]*"/, newScript));
} }

2
src/templates/preview.html
View File

@ -25,7 +25,7 @@
vertical-align: -0.1em; vertical-align: -0.1em;
} }
</style> </style>
<script src="https://twemoji.maxcdn.com/v/{{version}}/twemoji.min.js" integrity="{{integrityHash}}"crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/@twemoji/api@{{version}}/dist/twemoji.min.js" integrity="{{integrityHash}}"crossorigin="anonymous"></script>
</head> </head>
<body> <body>
<ul class="emoji-list"> <ul class="emoji-list">

2
src/test/preview-svg.html
View File

@ -25,7 +25,7 @@
vertical-align: -0.1em; vertical-align: -0.1em;
} }
</style> </style>
<script src="https://unpkg.com/twemoji@latest/dist/twemoji.min.js" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/@twemoji/api@latest/dist/twemoji.min.js" crossorigin="anonymous"></script>
</head> </head>
<body> <body>
<ul class="emoji-list"> <ul class="emoji-list">

2
src/test/preview.html
View File

@ -25,7 +25,7 @@
vertical-align: -0.1em; vertical-align: -0.1em;
} }
</style> </style>
<script src="https://twemoji.maxcdn.com/v/latest/twemoji.min.js" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/@twemoji/api@latest/dist/twemoji.min.js" crossorigin="anonymous"></script>
</head> </head>
<body> <body>
<ul class="emoji-list"> <ul class="emoji-list">