Make the source of the static assets configurable
- Easy to switch between different CDN - Allow self-host static assets
This commit is contained in:
Cotes Chung
parent
51688ccc9f
commit
3685685b28
15 changed files with 240 additions and 53 deletions
10
_config.yml
10
_config.yml
|
|
@ -53,7 +53,7 @@ social:
|
|||
google_site_verification: # fill in to your verification string
|
||||
|
||||
# ↑ --------------------------
|
||||
|
||||
# The end of `jekyll-seo-tag` settings
|
||||
|
||||
google_analytics:
|
||||
id: # fill in your Google Analytics ID
|
||||
|
|
@ -98,6 +98,14 @@ comments:
|
|||
repo: # <gh-username>/<repo>
|
||||
issue_term: # < url | pathname | title | ...>
|
||||
|
||||
# Self-hosted static assets, optional › https://github.com/cotes2020/chirpy-static-assets
|
||||
assets:
|
||||
self_host:
|
||||
enabled: # boolean, keep empty means false
|
||||
# specify the Jekyll environment, empty means both
|
||||
# only works if `assets.self_host.enabled` is 'true'
|
||||
env: # [development|production]
|
||||
|
||||
paginate: 10
|
||||
|
||||
# ------------ The following options are not recommended to be modified ------------------
|
||||
|
|
|
|||
65
_data/assets/cross_origin.yml
Normal file
65
_data/assets/cross_origin.yml
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
# CDNs
|
||||
|
||||
cdns:
|
||||
# Google Fonts
|
||||
- url: https://fonts.googleapis.com
|
||||
- url: https://fonts.gstatic.com
|
||||
args: crossorigin
|
||||
- url: https://fonts.googleapis.com
|
||||
# jsDelivr CDN
|
||||
- url: https://cdn.jsdelivr.net
|
||||
|
||||
# fonts
|
||||
|
||||
webfonts: https://fonts.googleapis.com/css2?family=Lato&family=Source+Sans+Pro:wght@400;600;700;900&display=swap
|
||||
|
||||
# Libraries
|
||||
|
||||
jquery:
|
||||
js: https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js
|
||||
|
||||
bootstrap:
|
||||
css: https://cdn.jsdelivr.net/npm/bootstrap@4/dist/css/bootstrap.min.css
|
||||
js: https://cdn.jsdelivr.net/npm/bootstrap@4/dist/js/bootstrap.bundle.min.js
|
||||
|
||||
bootstrap-toc:
|
||||
css: https://cdn.jsdelivr.net/gh/afeld/bootstrap-toc@1.0.1/dist/bootstrap-toc.min.css
|
||||
js: https://cdn.jsdelivr.net/gh/afeld/bootstrap-toc@1.0.1/dist/bootstrap-toc.min.js
|
||||
|
||||
fontawesome:
|
||||
css: https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.11.2/css/all.min.css
|
||||
|
||||
search:
|
||||
js: https://cdn.jsdelivr.net/npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js
|
||||
|
||||
mermaid:
|
||||
js: https://cdn.jsdelivr.net/npm/mermaid@8/dist/mermaid.min.js
|
||||
|
||||
dayjs:
|
||||
js:
|
||||
common: https://cdn.jsdelivr.net/npm/dayjs@1/dayjs.min.js
|
||||
locale: https://cdn.jsdelivr.net/npm/dayjs@1/locale/:LOCALE.min.js
|
||||
relativeTime: https://cdn.jsdelivr.net/npm/dayjs@1/plugin/relativeTime.min.js
|
||||
localizedFormat: https://cdn.jsdelivr.net/npm/dayjs@1/plugin/localizedFormat.min.js
|
||||
|
||||
countup:
|
||||
js: https://cdn.jsdelivr.net/npm/countup.js@1.9.3/dist/countUp.min.js
|
||||
|
||||
magnific-popup:
|
||||
css: https://cdn.jsdelivr.net/npm/magnific-popup@1/dist/magnific-popup.min.css
|
||||
js: https://cdn.jsdelivr.net/npm/magnific-popup@1/dist/jquery.magnific-popup.min.js
|
||||
|
||||
lozad:
|
||||
js: https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js
|
||||
|
||||
clipboard:
|
||||
js: https://cdn.jsdelivr.net/npm/clipboard@2/dist/clipboard.min.js
|
||||
|
||||
polyfill:
|
||||
js: https://polyfill.io/v3/polyfill.min.js?features=es6
|
||||
|
||||
mathjax:
|
||||
js: https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js
|
||||
|
||||
utterances:
|
||||
js: https://utteranc.es/client.js
|
||||
54
_data/assets/self_host.yml
Normal file
54
_data/assets/self_host.yml
Normal file
|
|
@ -0,0 +1,54 @@
|
|||
# fonts
|
||||
|
||||
webfonts: /assets/lib/fonts/main.css
|
||||
|
||||
# Libraries
|
||||
|
||||
jquery:
|
||||
js: /assets/lib/jquery-3.6.0/jquery.min.js
|
||||
|
||||
bootstrap:
|
||||
css: /assets/lib/bootstrap-4.6.1/bootstrap.min.css
|
||||
js: /assets/lib/bootstrap-4.6.1/bootstrap.bundle.min.js
|
||||
|
||||
bootstrap-toc:
|
||||
css: /assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.css
|
||||
js: /assets/lib/bootstrap-toc-1.0.1/bootstrap-toc.min.js
|
||||
|
||||
fontawesome:
|
||||
css: /assets/lib/fontawesome-free-5.15.4/css/all.min.css
|
||||
|
||||
search:
|
||||
js: /assets/lib/simple-jekyll-search-1.10.0/simple-jekyll-search.min.js
|
||||
|
||||
mermaid:
|
||||
js: /assets/lib/mermaid-8.13.10/mermaid.min.js
|
||||
|
||||
dayjs:
|
||||
js:
|
||||
common: /assets/lib/dayjs-1.10.7/dayjs.min.js
|
||||
locale: /assets/lib/dayjs-1.10.7/locale/en.min.js
|
||||
relativeTime: /assets/lib/dayjs-1.10.7/plugin/relativeTime.min.js
|
||||
localizedFormat: /assets/lib/dayjs-1.10.7/plugin/localizedFormat.min.js
|
||||
|
||||
countup:
|
||||
js: /assets/lib/countup.js-1.9.3/countUp.min.js
|
||||
|
||||
magnific-popup:
|
||||
css: /assets/lib/magnific-popup-1.1.0/magnific-popup.css
|
||||
js: /assets/lib/magnific-popup-1.1.0/jquery.magnific-popup.min.js
|
||||
|
||||
lozad:
|
||||
js: /assets/lib/lozad-1.16.0/lozad.min.js
|
||||
|
||||
clipboard:
|
||||
js: /assets/lib/clipboard-2.0.9/clipboard.min.js
|
||||
|
||||
polyfill:
|
||||
js: /assets/lib/polyfill-v3-es6/polyfill.min.js
|
||||
|
||||
mathjax:
|
||||
js: /assets/lib/mathjax-3.2.0/tex-chtml.js
|
||||
|
||||
utterances:
|
||||
js: /assets/lib/utterances/client.js
|
||||
12
_includes/assets-origin.html
Normal file
12
_includes/assets-origin.html
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
{% comment %} Site static assets origin {% endcomment %}
|
||||
{% assign origin = 'cross_origin' %}
|
||||
|
||||
{% if site.assets.self_host.enabled %}
|
||||
{% if site.assets.self_host.env %}
|
||||
{% if site.assets.self_host.env == jekyll.environment %}
|
||||
{% assign origin = 'self_host' %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
{% assign origin = 'self_host' %}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<!-- https://utteranc.es/ -->
|
||||
<script src="https://utteranc.es/client.js"
|
||||
<script src="{{ site.data.assets[origin].utterances.js }}"
|
||||
repo="{{ site.comments.utterances.repo }}"
|
||||
issue-term="{{ site.comments.utterances.issue_term }}"
|
||||
crossorigin="anonymous"
|
||||
|
|
|
|||
|
|
@ -1,15 +0,0 @@
|
|||
<!--
|
||||
CSS selector for site.
|
||||
-->
|
||||
|
||||
<link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}">
|
||||
|
||||
{% if site.toc and page.toc %}
|
||||
<link rel="stylesheet"
|
||||
href="https://cdn.jsdelivr.net/gh/afeld/bootstrap-toc@1.0.1/dist/bootstrap-toc.min.css">
|
||||
{% endif %}
|
||||
|
||||
{% if page.layout == 'page' or page.layout == 'post' %}
|
||||
<!-- Manific Popup -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/magnific-popup@1.1.0/dist/magnific-popup.min.css">
|
||||
{% endif %}
|
||||
|
|
@ -34,9 +34,20 @@
|
|||
|
||||
{% include favicons.html %}
|
||||
|
||||
<!-- Google Fonts -->
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous">
|
||||
<link rel="dns-prefetch" href="https://fonts.gstatic.com">
|
||||
{% if site.resources.ignore_env != jekyll.environment and site.resources.self_hosted %}
|
||||
|
||||
<link href="{{ site.data.assets[origin].webfonts | relative_url }}" rel="stylesheet">
|
||||
|
||||
{% else %}
|
||||
|
||||
{% for cdn in site.data.assets[origin].cdns %}
|
||||
<link rel="preconnect" href="{{ cdn.url }}" {{ cdn.args }}>
|
||||
<link rel="dns-prefetch" href="{{ cdn.url }}" {{ cdn.args }}>
|
||||
{% endfor %}
|
||||
|
||||
<link rel="stylesheet" href="{{ site.data.assets[origin].webfonts }}">
|
||||
|
||||
{% endif %}
|
||||
|
||||
<!-- GA -->
|
||||
{% if jekyll.environment == 'production'
|
||||
|
|
@ -49,27 +60,31 @@
|
|||
|
||||
{% if site.google_analytics.pv.proxy_endpoint %}
|
||||
{% assign proxy_url = site.google_analytics.pv.proxy_endpoint
|
||||
| replace: "https://", "" | split: "/" | first | prepend: "https://" %}
|
||||
|
||||
| replace: "https://", "" | split: "/" | first | prepend: "https://" %}
|
||||
<link rel="preconnect" href="{{ proxy_url }}" crossorigin="use-credentials">
|
||||
<link rel="dns-prefetch" href="{{ proxy_url }}">
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
<!-- jsDelivr CDN -->
|
||||
<link rel="preconnect" href="https://cdn.jsdelivr.net">
|
||||
<link rel="dns-prefetch" href="https://cdn.jsdelivr.net">
|
||||
|
||||
<!-- Bootstrap -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="{{ site.data.assets[origin].bootstrap.css }}">
|
||||
|
||||
<!-- Font Awesome -->
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.11.2/css/all.min.css">
|
||||
<link rel="stylesheet" href="{{ site.data.assets[origin].fontawesome.css }}">
|
||||
|
||||
{% include css-selector.html %}
|
||||
<link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}">
|
||||
|
||||
{% if site.toc and page.toc %}
|
||||
<link rel="stylesheet" href="{{ site.data.assets[origin].bootstrap-toc.css }}">
|
||||
{% endif %}
|
||||
|
||||
{% if page.layout == 'page' or page.layout == 'post' %}
|
||||
<!-- Manific Popup -->
|
||||
<link rel="stylesheet" href="{{ site.data.assets[origin].magnific-popup.css }}">
|
||||
{% endif %}
|
||||
|
||||
<!-- JavaScript -->
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js"></script>
|
||||
<script src="{{ site.data.assets[origin].jquery.js }}"></script>
|
||||
|
||||
</head>
|
||||
|
|
|
|||
|
|
@ -7,21 +7,27 @@
|
|||
{% if page.layout == 'post' %}
|
||||
{% if site.google_analytics.pv.proxy_endpoint or site.google_analytics.pv.cache_path %}
|
||||
<!-- pv-report needs countup.js -->
|
||||
<script async src="https://cdn.jsdelivr.net/npm/countup.js@1.9.3/dist/countUp.min.js"></script>
|
||||
<script async src="{{ site.data.assets[origin].countup.js }}"></script>
|
||||
<script defer src="{{ '/assets/js/dist/pvreport.min.js' | relative_url }}"></script>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
||||
{% if page.layout == 'post' or page.layout == 'page' %}
|
||||
<!-- image lazy-loading & popup -->
|
||||
<script src="https://cdn.jsdelivr.net/combine/npm/lozad/dist/lozad.min.js,npm/magnific-popup@1/dist/jquery.magnific-popup.min.js,npm/clipboard@2/dist/clipboard.min.js"></script>
|
||||
<!-- image lazy-loading & popup & clipboard -->
|
||||
{% assign _urls = site.data.assets[origin].magnific-popup.js
|
||||
| append: ',' | append: site.data.assets[origin].lozad.js
|
||||
| append: ',' | append: site.data.assets[origin].clipboard.js
|
||||
%}
|
||||
|
||||
{% include jsdelivr-combine.html urls=_urls %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
{% if page.layout == 'home'
|
||||
or page.layout == 'post'
|
||||
or page.layout == 'archives'
|
||||
or page.layout == 'category'
|
||||
or page.layout == 'tag' %}
|
||||
or page.layout == 'post'
|
||||
or page.layout == 'archives'
|
||||
or page.layout == 'category'
|
||||
or page.layout == 'tag' %}
|
||||
|
||||
{% if site.prefer_datetime_locale %}
|
||||
{% assign locale = site.prefer_datetime_locale | downcase %}
|
||||
|
|
@ -29,24 +35,32 @@
|
|||
{% assign locale = site.lang | split: '-' | first %}
|
||||
{% endif %}
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/combine/npm/dayjs@1,npm/dayjs@1/locale/{{ locale }}.min.js,npm/dayjs@1/plugin/relativeTime.min.js,npm/dayjs@1/plugin/localizedFormat.min.js"></script>
|
||||
{% assign _urls = site.data.assets[origin].dayjs.js.common
|
||||
| append: ',' | append: site.data.assets[origin].dayjs.js.locale
|
||||
| replace: ':LOCALE', locale
|
||||
| append: ',' | append: site.data.assets[origin].dayjs.js.relativeTime
|
||||
| append: ',' | append: site.data.assets[origin].dayjs.js.localizedFormat
|
||||
%}
|
||||
|
||||
{% include jsdelivr-combine.html urls=_urls %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
{% if page.layout == 'home'
|
||||
or page.layout == 'categories'
|
||||
or page.layout == 'post'
|
||||
or page.layout == 'page' %}
|
||||
or page.layout == 'categories'
|
||||
or page.layout == 'post'
|
||||
or page.layout == 'page' %}
|
||||
{% assign type = page.layout %}
|
||||
{% elsif page.layout == 'archives'
|
||||
or page.layout == 'category'
|
||||
or page.layout == 'tag' %}
|
||||
or page.layout == 'category'
|
||||
or page.layout == 'tag' %}
|
||||
{% assign type = "misc" %}
|
||||
{% else %}
|
||||
{% assign type = "commons" %}
|
||||
{% endif %}
|
||||
|
||||
{% assign js = type | prepend: '/assets/js/dist/' | append: '.min.js' %}
|
||||
<script defer src="{{ js | relative_url }}"></script>
|
||||
{% capture script %}/assets/js/dist/{{ type }}.min.js{% endcapture %}
|
||||
<script defer src="{{ script | relative_url }}"></script>
|
||||
|
||||
{% if page.math %}
|
||||
<!-- MathJax -->
|
||||
|
|
@ -65,15 +79,14 @@
|
|||
}
|
||||
};
|
||||
</script>
|
||||
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
|
||||
<script type="text/javascript" id="MathJax-script" async
|
||||
src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js">
|
||||
<script src="{{ site.data.assets[origin].polyfill.js }}"></script>
|
||||
<script id="MathJax-script" async src="{{ site.data.assets[origin].mathjax.js }}">
|
||||
</script>
|
||||
{% endif %}
|
||||
|
||||
<!-- commons -->
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/combine/npm/popper.js@1.16.1,npm/bootstrap@4/dist/js/bootstrap.min.js"></script>
|
||||
<script src="{{ site.data.assets[origin].bootstrap.js }}"></script>
|
||||
|
||||
{% if jekyll.environment == 'production' %}
|
||||
<!-- PWA -->
|
||||
|
|
|
|||
32
_includes/jsdelivr-combine.html
Normal file
32
_includes/jsdelivr-combine.html
Normal file
|
|
@ -0,0 +1,32 @@
|
|||
{% assign urls = include.urls | split: ',' %}
|
||||
|
||||
{% assign combined_urls = nil %}
|
||||
|
||||
{% assign domain = 'https://cdn.jsdelivr.net/' %}
|
||||
|
||||
{% for url in urls %}
|
||||
|
||||
{% if url contains domain %}
|
||||
{% assign url_snippet = url | slice: domain.size, url.size %}
|
||||
|
||||
{% if combined_urls %}
|
||||
{% assign combined_urls = combined_urls | append: ',' | append: url_snippet %}
|
||||
{% else %}
|
||||
{% assign combined_urls = domain | append: 'combine/' | append: url_snippet %}
|
||||
{% endif %}
|
||||
|
||||
{% elsif url contains '//' %}
|
||||
|
||||
<script src="{{ url }}"></script>
|
||||
|
||||
{% else %}
|
||||
|
||||
<script src="{{ url | relative_url }}"></script>
|
||||
|
||||
{% endif %}
|
||||
|
||||
{% endfor %}
|
||||
|
||||
{% if combined_urls %}
|
||||
<script src="{{ combined_urls }}"></script>
|
||||
{% endif %}
|
||||
|
|
@ -2,7 +2,7 @@
|
|||
mermaid-js loader
|
||||
-->
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/mermaid@8/dist/mermaid.min.js"></script>
|
||||
<script src="{{ site.data.assets[origin].mermaid.js }}"></script>
|
||||
|
||||
<script>
|
||||
$(function() {
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
|
||||
{% capture not_found %}<p class="mt-5">{{ site.data.locales[lang].search.no_results }}</p>{% endcapture %}
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/simple-jekyll-search@1.10.0/dest/simple-jekyll-search.min.js"></script>
|
||||
<script src="{{ site.data.assets[origin].search.js }}"></script>
|
||||
|
||||
<script>
|
||||
SimpleJekyllSearch({
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
|
||||
{% if enable_toc %}
|
||||
<!-- BS-toc.js will be loaded at medium priority -->
|
||||
<script src="https://cdn.jsdelivr.net/gh/afeld/bootstrap-toc@1.0.1/dist/bootstrap-toc.min.js"></script>
|
||||
<script src="{{ site.data.assets[origin].bootstrap-toc.js }}"></script>
|
||||
|
||||
<div id="toc-wrapper" class="pl-0 pr-4 mb-5">
|
||||
<div class="panel-heading pl-3 pt-2 mb-2">{{- site.data.locales[lang].panel.toc -}}</div>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,8 @@ layout: compress
|
|||
|
||||
{% include lang.html %}
|
||||
|
||||
{% include assets-origin.html %}
|
||||
|
||||
{% capture prefer_mode %}
|
||||
{% if site.theme_mode %}
|
||||
data-mode="{{ site.theme_mode }}"
|
||||
|
|
|
|||
|
|
@ -4,6 +4,8 @@ layout: default
|
|||
|
||||
{% include lang.html %}
|
||||
|
||||
{% include assets-origin.html %}
|
||||
|
||||
<div class="row">
|
||||
|
||||
<!-- core -->
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
/*
|
||||
The common styles
|
||||
*/
|
||||
@import url('https://fonts.googleapis.com/css2?family=Lato&family=Source+Sans+Pro:wght@400;600;900&display=swap');
|
||||
|
||||
html {
|
||||
@media (prefers-color-scheme: light) {
|
||||
|
|
|
|||
Loading…
Reference in a new issue