The Trans Directory
Revert "feat: Making Quartz available offline by making it a PWA (#465)"
This reverts commit d6301fae90d9f922618bf0f413e273156731eef7.
+6
-235
-2
docs/configuration.md
-2
docs/configuration.md
···
21
21
This part of the configuration concerns anything that can affect the whole site. The following is a list breaking down all the things you can configure:
22
22
23
23
- `pageTitle`: title of the site. This is also used when generating the [[RSS Feed]] for your site.
24
-
- `description`: description of the site. This will be used when someone installs your site as an App.
25
24
- `enableSPA`: whether to enable [[SPA Routing]] on your site.
26
25
- `enablePopovers`: whether to enable [[popover previews]] on your site.
27
26
- `analytics`: what to use for analytics on your site. Values can be
28
27
- `null`: don't use analytics;
29
-
- `{ provider: "umami", websiteId: <your-umami-id> }`: easy, privacy-friendly, open source, GDPR Compliant analytics;
30
28
- `{ provider: 'plausible' }`: use [Plausible](https://plausible.io/), a privacy-friendly alternative to Google Analytics; or
31
29
- `{ provider: 'google', tagId: <your-google-tag> }`: use Google Analytics
32
30
- `baseUrl`: this is used for sitemaps and RSS feeds that require an absolute URL to know where the canonical 'home' of your site lives. This is normally the deployed URL of your site (e.g. `quartz.jzhao.xyz` for this site). Do not include the protocol (i.e. `https://`) or any leading or trailing slashes.
-31
docs/features/offline access.md
-31
docs/features/offline access.md
···
1
-
---
2
-
title: "Offline Access (PWA)"
3
-
tags:
4
-
- plugin/emitter
5
-
---
6
-
7
-
This plugin allows your website to be accessible offline and be installed as an app. You can use it by adding `Plugin.Offline(),` to the `emitters` in `quartz.config.ts`
8
-
9
-
## Offline Capability
10
-
11
-
Whenever you visit a page it gets cached for offline use. Depending on the kind of content, the process for caching is diffent:
12
-
13
-
- **Pages** (HTML, your converted Markdown files): Quartz first tries to get them over the Network. If that fails, your browser attempts to fetch it from the cache.
14
-
- **Static Resources** (Fonts, CSS Styling, JavaScript): Quartz uses cached resources by default and updates the cache over the network in the background.
15
-
- **Images**: Images are saved once and then served from cache. Quartz uses a limited cache of 60 images and images remain in the cache for 30 days
16
-
17
-
You can edit the fallback page by changing the `offline.md` file in the root of your `content` directory
18
-
19
-
## Progressive Web App (PWA)
20
-
21
-
Progressive Web Apps can have [many properties](https://developer.mozilla.org/en-US/docs/Web/Manifest). We're only going to mention the ones Quartz supports by default, however you can edit the offline plugins file to add more in case required.
22
-
23
-
- **icons**: the `icon.svg` file in the `quartz/static` directory is used for all the icons. This makes it easier to scale the image since you don't need to provide an png for every size
24
-
- **name**, **short_name**: Uses the `pageTitle` configured in `quartz.config.ts`
25
-
- **description**: Uses the `description` configured in `quartz.config.ts`
26
-
- **background_color**, **theme_color**: Uses the `lightMode.light` color configured in `quartz.config.ts`.
27
-
- **start_url**: Uses the `baseUrl` configured in `quartz.config.ts`
28
-
29
-
### Default values
30
-
31
-
- **display**: this is set to `minimal-ui`
+1
-1
docs/index.md
+1
-1
docs/index.md
···
30
30
31
31
## 🔧 Features
32
32
33
-
- [[Obsidian compatibility]], [[full-text search]], [[graph view]], note transclusion, [[wikilinks]], [[backlinks]], [[Latex]], [[syntax highlighting]], [[popover previews]], [[offline access]] and [many more](./features) right out of the box
33
+
- [[Obsidian compatibility]], [[full-text search]], [[graph view]], note transclusion, [[wikilinks]], [[backlinks]], [[Latex]], [[syntax highlighting]], [[popover previews]], and [many more](./features) right out of the box
34
34
- Hot-reload for both configuration and content
35
35
- Simple JSX layouts and [[creating components|page components]]
36
36
- [[SPA Routing|Ridiculously fast page loads]] and tiny bundle sizes
+4
-5
package-lock.json
+4
-5
package-lock.json
···
73
73
"@types/flexsearch": "^0.7.3",
74
74
"@types/hast": "^2.3.4",
75
75
"@types/js-yaml": "^4.0.5",
76
-
"@types/node": "^20.6.2",
76
+
"@types/node": "^20.1.2",
77
77
"@types/pretty-time": "^1.1.2",
78
78
"@types/source-map-support": "^0.5.6",
79
79
"@types/workerpool": "^6.4.0",
···
113
113
},
114
114
"node_modules/@clack/prompts/node_modules/is-unicode-supported": {
115
115
"version": "1.3.0",
116
-
"extraneous": true,
117
116
"inBundle": true,
118
117
"license": "MIT",
119
118
"engines": {
···
1464
1463
}
1465
1464
},
1466
1465
"node_modules/@types/node": {
1467
-
"version": "20.6.2",
1468
-
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.6.2.tgz",
1469
-
"integrity": "sha512-Y+/1vGBHV/cYk6OI1Na/LHzwnlNCAfU3ZNGrc1LdRe/LAIbdDPTTv/HU3M7yXN448aTVDq3eKRm2cg7iKLb8gw==",
1466
+
"version": "20.3.3",
1467
+
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.3.3.tgz",
1468
+
"integrity": "sha512-wheIYdr4NYML61AjC8MKj/2jrR/kDQri/CIpVoZwldwhnIrD/j9jIU5bJ8yBKuB2VhpFV7Ab6G2XkBjv9r9Zzw==",
1470
1469
"dev": true
1471
1470
},
1472
1471
"node_modules/@types/parse5": {
+1
-1
package.json
+1
-1
package.json
-1
quartz.config.ts
-1
quartz.config.ts
-1
quartz/cfg.ts
-1
quartz/cfg.ts
···
19
19
20
20
export interface GlobalConfiguration {
21
21
pageTitle: string
22
-
description: string
23
22
/** Whether to enable single-page-app style rendering. this prevents flashes of unstyled content and improves smoothness of Quartz */
24
23
enableSPA: boolean
25
24
/** Whether to display Wikipedia-style popovers when hovering over links */
-4
quartz/components/Head.tsx
-4
quartz/components/Head.tsx
···
14
14
15
15
const iconPath = joinSegments(baseDir, "static/icon.png")
16
16
const ogImagePath = `https://${cfg.baseUrl}/static/og-image.png`
17
-
const manifest =
18
-
cfg.baseUrl == undefined ? "/manifest.json" : `https://${cfg.baseUrl}/manifest.json`
19
17
20
18
return (
21
19
<head>
···
27
25
{cfg.baseUrl && <meta property="og:image" content={ogImagePath} />}
28
26
<meta property="og:width" content="1200" />
29
27
<meta property="og:height" content="675" />
30
-
<meta name="theme-color" content="#faf8f8" />
31
28
<link rel="icon" href={iconPath} />
32
-
<link rel="manifest" href={manifest} />
33
29
<meta name="description" content={description} />
34
30
<meta name="generator" content="Quartz" />
35
31
<link rel="preconnect" href="https://fonts.googleapis.com" />
-12
quartz/components/pages/OfflineFallbackPage.tsx
-12
quartz/components/pages/OfflineFallbackPage.tsx
···
1
-
import { QuartzComponentConstructor } from "../types"
2
-
3
-
function OfflineFallbackPage() {
4
-
return (
5
-
<article class="popover-hint">
6
-
<h1>Offline</h1>
7
-
<p>This page isn't offline available yet.</p>
8
-
</article>
9
-
)
10
-
}
11
-
12
-
export default (() => OfflineFallbackPage) satisfies QuartzComponentConstructor
-5
quartz/plugins/emitters/componentResources.ts
-5
quartz/plugins/emitters/componentResources.ts
···
116
116
document.dispatchEvent(event)`)
117
117
}
118
118
119
-
componentResources.afterDOMLoaded.push(`
120
-
if ('serviceWorker' in navigator) {
121
-
navigator.serviceWorker.register('/sw.js');
122
-
}`)
123
-
124
119
let wsUrl = `ws://localhost:${ctx.argv.wsPort}`
125
120
126
121
if (ctx.argv.remoteDevHost) {
-1
quartz/plugins/emitters/index.ts
-1
quartz/plugins/emitters/index.ts
-97
quartz/plugins/emitters/offline.ts
-97
quartz/plugins/emitters/offline.ts
···
1
-
import { QuartzEmitterPlugin } from "../types"
2
-
import { FilePath, FullSlug } from "../../util/path"
3
-
import { FullPageLayout } from "../../cfg"
4
-
import { sharedPageComponents } from "../../../quartz.layout"
5
-
import OfflineFallbackPage from "../../components/pages/OfflineFallbackPage"
6
-
import BodyConstructor from "../../components/Body"
7
-
import { pageResources, renderPage } from "../../components/renderPage"
8
-
import { defaultProcessedContent } from "../vfile"
9
-
import { QuartzComponentProps } from "../../components/types"
10
-
11
-
export const Offline: QuartzEmitterPlugin = () => {
12
-
const opts: FullPageLayout = {
13
-
...sharedPageComponents,
14
-
pageBody: OfflineFallbackPage(),
15
-
beforeBody: [],
16
-
left: [],
17
-
right: [],
18
-
}
19
-
20
-
const { head: Head, pageBody, footer: Footer } = opts
21
-
const Body = BodyConstructor()
22
-
23
-
return {
24
-
name: "OfflineSupport",
25
-
getQuartzComponents() {
26
-
return [Head, Body, pageBody, Footer]
27
-
},
28
-
async emit({ cfg }, _content, resources, emit): Promise<FilePath[]> {
29
-
const manifest = {
30
-
short_name: cfg.configuration.pageTitle,
31
-
name: cfg.configuration.pageTitle,
32
-
description: cfg.configuration.description,
33
-
background_color: cfg.configuration.theme.colors.lightMode.light,
34
-
theme_color: cfg.configuration.theme.colors.lightMode.light,
35
-
display: "minimal-ui",
36
-
icons: [
37
-
{
38
-
src: "static/icon.svg",
39
-
sizes: "any",
40
-
purpose: "maskable",
41
-
},
42
-
{
43
-
src: "static/icon.svg",
44
-
sizes: "any",
45
-
purpose: "any",
46
-
},
47
-
],
48
-
start_url:
49
-
cfg.configuration.baseUrl == undefined ? "/" : `https://${cfg.configuration.baseUrl}/`,
50
-
}
51
-
52
-
const serviceWorker =
53
-
"importScripts('https://storage.googleapis.com/workbox-cdn/releases/6.4.1/workbox-sw.js');" +
54
-
"const {pageCache, imageCache, staticResourceCache, googleFontsCache, offlineFallback} = workbox.recipes;" +
55
-
"pageCache(); googleFontsCache(); staticResourceCache(); imageCache(); offlineFallback();"
56
-
57
-
const slug = "offline" as FullSlug
58
-
59
-
const url = new URL(`https://${cfg.configuration.baseUrl ?? "example.com"}`)
60
-
const path = url.pathname as FullSlug
61
-
const externalResources = pageResources(path, resources)
62
-
const [tree, vfile] = defaultProcessedContent({
63
-
slug,
64
-
text: "Offline",
65
-
description: "This page isn't offline available yet.",
66
-
frontmatter: { title: "Offline", tags: [] },
67
-
})
68
-
69
-
const componentData: QuartzComponentProps = {
70
-
fileData: vfile.data,
71
-
externalResources,
72
-
cfg: cfg.configuration,
73
-
children: [],
74
-
tree,
75
-
allFiles: [],
76
-
}
77
-
78
-
return Promise.all([
79
-
emit({
80
-
content: JSON.stringify(manifest),
81
-
slug: "manifest" as FullSlug,
82
-
ext: ".json",
83
-
}),
84
-
emit({
85
-
content: serviceWorker,
86
-
slug: "sw" as FullSlug,
87
-
ext: ".js",
88
-
}),
89
-
emit({
90
-
content: renderPage(slug, componentData, opts, externalResources),
91
-
slug,
92
-
ext: ".html",
93
-
}),
94
-
])
95
-
},
96
-
}
97
-
}
-74
quartz/static/icon.svg
-74
quartz/static/icon.svg
···
1
-
<?xml version="1.0" standalone="no"?>
2
-
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
3
-
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
4
-
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
5
-
width="200.000000pt" height="200.000000pt" viewBox="0 0 200.000000 200.000000"
6
-
preserveAspectRatio="xMidYMid meet">
7
-
8
-
<g transform="translate(0.000000,200.000000) scale(0.100000,-0.100000)"
9
-
fill="#000000" stroke="none">
10
-
<path d="M990 1852 c-30 -20 -147 -97 -260 -171 -113 -74 -207 -136 -209 -138
11
-
-2 -1 20 -93 49 -203 29 -110 51 -202 49 -204 -2 -2 -35 3 -72 11 -37 8 -69
12
-
14 -71 12 -1 -2 -24 -66 -50 -141 l-47 -137 124 -175 125 -174 -40 -66 -40
13
-
-67 26 -32 c13 -18 36 -45 49 -62 20 -24 23 -34 16 -60 -15 -50 -13 -52 74
14
-
-65 54 -8 89 -19 103 -32 21 -19 26 -19 126 -5 97 13 111 13 192 -4 l86 -19
15
-
57 28 c52 27 58 33 77 87 20 56 24 60 90 96 60 32 74 46 103 96 18 32 33 61
16
-
33 65 0 3 -37 20 -82 36 -67 24 -82 34 -80 49 2 10 47 154 99 321 l94 303 -46
17
-
138 -46 138 -89 47 c-89 47 -90 48 -90 85 0 36 -6 43 -142 159 -79 67 -145
18
-
122 -148 121 -3 0 -30 -17 -60 -37z m60 0 c0 -4 18 -91 40 -192 22 -101 40
19
-
-192 40 -201 0 -11 -15 -22 -42 -31 l-43 -15 -5 -202 -5 -202 -84 -55 c-46
20
-
-30 -86 -53 -88 -51 -2 3 -58 522 -75 710 -3 24 13 41 122 137 120 105 140
21
-
119 140 102z m163 -121 c96 -83 107 -96 107 -126 l0 -33 -90 -22 c-50 -12 -92
22
-
-21 -94 -19 -1 2 -15 65 -30 139 -15 74 -30 146 -33 160 -7 29 -21 39 140 -99z
23
-
m-333 16 c-20 -17 -53 -47 -75 -66 l-39 -34 38 -373 c21 -205 36 -380 33 -388
24
-
-10 -25 -21 -20 -89 38 l-63 54 -75 277 c-62 232 -72 278 -60 285 8 5 92 61
25
-
185 124 94 63 172 115 175 115 3 0 -11 -14 -30 -32z m423 -279 c-8 -46 -16
26
-
-84 -18 -87 -6 -5 -169 21 -178 29 -5 4 4 11 19 14 24 6 26 10 21 46 -5 39 -4
27
-
40 31 49 21 5 53 14 72 19 70 20 69 22 53 -70z m122 39 l80 -43 37 -115 c21
28
-
-62 38 -117 38 -121 0 -12 -29 -9 -124 15 l-90 22 -31 52 -32 53 16 90 c8 49
29
-
18 90 21 90 3 0 41 -20 85 -43z m-124 -168 c8 -12 24 -36 34 -55 l18 -34 -57
30
-
-203 c-32 -111 -61 -205 -65 -210 -4 -4 -20 25 -37 64 -28 69 -31 72 -81 93
31
-
l-53 21 0 191 0 191 113 -19 c87 -15 116 -24 128 -39z m184 -121 c55 -12 101
32
-
-22 103 -23 4 -3 -189 -619 -197 -627 -7 -8 -102 -28 -131 -28 -17 0 -17 4 2
33
-
67 l21 68 -22 60 -21 60 60 210 c72 249 67 235 77 235 4 0 53 -10 108 -22z
34
-
m-901 -171 c50 -45 119 -107 154 -136 34 -30 62 -57 62 -60 -1 -3 -19 -18 -41
35
-
-33 -34 -24 -49 -28 -110 -28 -66 0 -79 4 -161 47 -49 26 -87 52 -85 57 2 6
36
-
21 62 42 124 21 61 40 112 43 112 3 0 46 -37 96 -83z m41 62 c11 -11 36 -91
37
-
30 -98 -3 -2 -34 24 -70 59 l-66 62 48 -7 c26 -3 52 -11 58 -16z m478 -129
38
-
l46 -20 -36 -61 c-32 -53 -53 -73 -182 -163 l-145 -103 -56 15 c-30 8 -59 18
39
-
-64 23 -13 12 59 99 122 148 52 39 260 181 267 181 1 0 23 -9 48 -20z m111
40
-
-170 c25 -63 46 -121 46 -129 0 -24 -64 -251 -70 -251 -4 0 -27 90 -53 200
41
-
l-46 200 32 54 c18 30 35 52 39 48 3 -4 27 -59 52 -122z m-605 -85 c18 -25 29
42
-
-49 26 -55 -3 -5 5 -47 19 -92 18 -59 21 -77 10 -63 -37 47 -234 324 -234 328
43
-
0 2 33 -13 73 -34 53 -27 82 -51 106 -84z m471 80 c0 -3 20 -92 45 -197 25
44
-
-106 45 -200 45 -210 0 -16 -12 -18 -139 -18 -101 0 -142 3 -148 13 -4 6 -25
45
-
59 -45 117 -28 82 -34 108 -25 117 18 19 251 182 260 183 4 0 7 -2 7 -5z
46
-
m-397 -64 c-24 -39 -33 -39 -62 -2 l-24 31 53 0 52 0 -19 -29z m61 -115 c37
47
-
-11 39 -14 72 -106 19 -52 37 -103 39 -112 5 -14 -5 -12 -67 11 -81 31 -80 31
48
-
-116 158 l-20 73 26 -7 c15 -3 44 -11 66 -17z m642 -118 c-3 -17 -8 -33 -10
49
-
-35 -2 -3 -27 6 -56 18 -54 23 -55 35 -5 42 76 11 78 10 71 -25z m89 10 c64
50
-
-24 59 -33 -23 -44 -48 -6 -52 -5 -52 14 0 20 9 52 15 52 2 0 29 -10 60 -22z
51
-
m-814 -30 c27 -33 23 -43 -20 -56 -59 -18 -62 -15 -33 33 15 25 28 45 30 45 2
52
-
0 12 -10 23 -22z m647 -9 c60 -25 60 -25 -42 -64 l-64 -24 16 60 c9 33 21 58
53
-
27 55 5 -2 34 -14 63 -27z m228 -36 c-31 -58 -30 -57 -75 -28 -23 16 -40 29
54
-
-38 31 5 5 122 32 125 29 2 -2 -3 -16 -12 -32z m-863 -74 c-10 -29 -19 -56
55
-
-21 -59 -5 -6 -72 70 -72 80 0 7 101 40 107 36 1 -1 -5 -27 -14 -57z m176 5
56
-
c3 -3 1 -8 -5 -12 -6 -4 -49 -35 -96 -69 -47 -35 -88 -63 -91 -63 -4 0 34 153
57
-
48 188 3 9 21 6 72 -13 37 -14 69 -28 72 -31z m520 24 c-1 -18 -4 -45 -8 -60
58
-
l-6 -27 -62 28 c-35 15 -65 30 -68 33 -6 6 111 57 133 58 7 0 12 -12 11 -32z
59
-
m72 10 c22 -12 39 -25 39 -29 0 -10 -90 -62 -97 -56 -6 7 7 107 14 107 3 0 23
60
-
-10 44 -22z m-346 -58 c-22 -10 -63 -28 -92 -39 l-52 -20 -26 33 c-14 18 -25
61
-
36 -25 39 0 4 53 7 118 6 l117 -1 -40 -18z m-198 -17 c36 -47 36 -51 -14 -87
62
-
-27 -20 -51 -36 -54 -36 -4 0 5 32 19 70 15 39 28 70 31 70 2 0 10 -8 18 -17z
63
-
m256 4 c-61 -97 -96 -147 -102 -147 -4 0 -26 19 -49 43 l-43 43 88 36 c97 40
64
-
118 45 106 25z m134 -14 c32 -15 59 -28 61 -29 2 -1 -2 -22 -8 -45 l-12 -44
65
-
-24 30 c-42 52 -85 115 -80 115 3 0 32 -12 63 -27z m-464 -62 l-27 -73 -60 7
66
-
c-59 6 -74 11 -65 19 28 24 173 126 175 123 2 -2 -8 -36 -23 -76z m371 -12 c4
67
-
-45 10 -88 13 -96 6 -16 -16 -14 -100 11 l-38 11 53 82 c29 45 55 80 59 77 3
68
-
-2 10 -40 13 -85z m116 -59 c0 -7 -65 -40 -79 -40 -5 0 -12 30 -15 68 -4 37
69
-
-9 81 -12 97 -5 25 3 18 50 -44 31 -41 56 -77 56 -81z m-317 25 c21 -25 32
70
-
-45 25 -45 -7 0 -42 -5 -78 -10 -35 -5 -66 -7 -68 -5 -6 5 68 105 77 105 4 0
71
-
24 -20 44 -45z m-124 -24 c-21 -28 -49 -42 -49 -23 0 8 63 62 68 57 2 -2 -6
72
-
-17 -19 -34z"/>
73
-
</g>
74
-
</svg>
