pwa: add manifest and related app icons #41

Merged
offbyn merged 1 commits from pwa-add-manifest into master 2 years ago

@ -8,19 +8,22 @@ import { replaceOnCopyPlugin } from './tools/esbuild-helper.js'
// see docs at https://esbuild.github.io/api/
export const options = {
entryPoints: [
'src/main.js',
'src/main.css',
'src/index.html',
'src/about.html',
'src/assets/comment.svg',
'src/assets/heart-fill.svg',
'src/assets/nostr-favicon.png',
'src/assets/nostr-favicon.svg',
'src/assets/star.svg',
'src/assets/star-fill.svg',
'src/favicon.ico',
'src/index.html',
'src/main.css',
'src/main.js',
'src/manifest.json',
],
outdir: 'dist',
//entryNames: '[name]-[hash]', TODO: replace urls in index.html with hashed paths
loader: {'.html': 'copy', '.svg': 'copy', '.ico': 'copy'},
loader: {'.html': 'copy', '.ico': 'copy', '.png': 'copy', '.svg': 'copy'},
bundle: true,
platform: 'browser',
minify: false, // TODO: true for release and enable sourcemap
@ -36,6 +39,7 @@ export const options = {
}),
NodeGlobalsPolyfillPlugin({buffer: true}),
replaceOnCopyPlugin(/about\.html$/),
replaceOnCopyPlugin(/manifest\.json$/),
x1ddos commented 2 years ago
Review

if there's nothing to replace, you could instead add the .json extension to the loader:

loader: {..., '.json': 'copy'}

and remove replaceOnCopyPlugin(/manifest\.json$/) from here.

if there's nothing to replace, you could instead add the .json extension to the loader: ```js loader: {..., '.json': 'copy'} ``` and remove `replaceOnCopyPlugin(/manifest\.json$/)` from here.
offbyn commented 2 years ago
Review

I did at first, but then it also found some package.json (not ours iirc)

the only way i could make it work is with replaceOnCopyPlugin(/manifest\.json$/)

I did at first, but then it also found some package.json (not ours iirc) the only way i could make it work is with `replaceOnCopyPlugin(/manifest\.json$/)`
x1ddos commented 2 years ago
Review

ah good to know! 👍

ah good to know! 👍
offbyn commented 2 years ago
Review

adding '.json': 'copy', adds the following (at least on pc):

cat dist/package-RG2JZGPY.json 
{
  "name": "websocket",
  "description": "Websocket Client & Server Library implementing the WebSocket protocol as specified in RFC 6455.",
  "keywords": [

adding `'.json': 'copy',` adds the following (at least on pc): ``` cat dist/package-RG2JZGPY.json { "name": "websocket", "description": "Websocket Client & Server Library implementing the WebSocket protocol as specified in RFC 6455.", "keywords": [ ```
x1ddos commented 2 years ago
Review

🤮 yeah, keep the replaceOnCopyPlugin then!

🤮 yeah, keep the replaceOnCopyPlugin then!
]
};

@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>about / nostr</title>
<link rel="stylesheet" href="main.css" type="text/css">
<link rel="manifest" href="/manifest.json">
</head>
<body>
<main class="text">

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="331.088" height="331.088" viewBox="0 0 87.6 87.6">
<circle cx="90.953" cy="119.632" r="37.72" style="fill:none;fill-opacity:1;stroke:#f0f;stroke-width:12.16;stroke-dasharray:none;stroke-opacity:1" transform="translate(-47.152 -75.832)"/>
</svg>

After

Width:  |  Height:  |  Size: 294 B

@ -5,6 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>nostr</title>
<link rel="stylesheet" href="main.css" type="text/css">
<link rel="manifest" href="/manifest.json">
</head>
<body>
<main class="tabbed">

@ -0,0 +1,21 @@
{
"$schema": "https://json.schemastore.org/web-manifest-combined.json",
"background_color": "#191919",
offbyn commented 2 years ago
Review

dark-mode first :)

dark-mode first :)
"categories": ["news", "social"],
"description": "a nostr news client to connect with the world.",
"display": "fullscreen",
"name": "nostr",
"short_name": "nostr",
"start_url": "https://nostr.ch/",
"icons": [{
"src": "assets/nostr-favicon.png",
"sizes": "256x256",
"type": "image/png"
}, {
"src": "favicon.ico",
"sizes": "32x32"
}, {
"src": "assets/nostr-favicon.svg",
"sizes": "any"
}]
}
Loading…
Cancel
Save