mirror of
https://github.com/navidrome/navidrome.git
synced 2025-04-01 19:47:37 +03:00
fix(ui): PWA not updating properly in new Vite config (#3493)
* fix: pwa not updating. use the custom code we had before Signed-off-by: Deluan <deluan@navidrome.org> * fix: docker build Signed-off-by: Deluan <deluan@navidrome.org> --------- Signed-off-by: Deluan <deluan@navidrome.org>
This commit is contained in:
Deluan Quintão
GitHub
parent
1c0ebb9460
commit
cbf5e3d51b
9 changed files with 1840 additions and 438 deletions
|
|
@ -49,6 +49,7 @@ WORKDIR /app
|
|||
|
||||
# Install node dependencies
|
||||
COPY ui/package.json ui/package-lock.json ./
|
||||
COPY ui/bin/ ./bin/
|
||||
RUN npm ci
|
||||
|
||||
# Build bundle
|
||||
|
|
|
|||
|
|
@ -2,4 +2,5 @@ node_modules/
|
|||
build/
|
||||
prettier.config.js
|
||||
.eslintrc
|
||||
vite.config.js
|
||||
vite.config.js
|
||||
public/3rdparty/workbox
|
||||
1
ui/.gitignore
vendored
1
ui/.gitignore
vendored
|
|
@ -4,3 +4,4 @@ node_modules
|
|||
build/*
|
||||
!build/.gitkeep
|
||||
/coverage/
|
||||
public/3rdparty/workbox
|
||||
16
ui/bin/update-workbox.sh
Executable file
16
ui/bin/update-workbox.sh
Executable file
|
|
@ -0,0 +1,16 @@
|
|||
#!/usr/bin/env sh
|
||||
|
||||
set -e
|
||||
|
||||
export WORKBOX_DIR=public/3rdparty/workbox
|
||||
|
||||
rm -rf ${WORKBOX_DIR}
|
||||
workbox copyLibraries build/3rdparty/
|
||||
|
||||
mkdir -p ${WORKBOX_DIR}
|
||||
mv build/3rdparty/workbox-*/workbox-sw.js ${WORKBOX_DIR}
|
||||
mv build/3rdparty/workbox-*/workbox-core.prod.js ${WORKBOX_DIR}
|
||||
mv build/3rdparty/workbox-*/workbox-strategies.prod.js ${WORKBOX_DIR}
|
||||
mv build/3rdparty/workbox-*/workbox-routing.prod.js ${WORKBOX_DIR}
|
||||
mv build/3rdparty/workbox-*/workbox-navigation-preload.prod.js ${WORKBOX_DIR}
|
||||
rm -rf build/3rdparty/workbox-*
|
||||
2176
ui/package-lock.json
generated
2176
ui/package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -12,7 +12,8 @@
|
|||
"type-check": "tsc --noEmit",
|
||||
"lint": "eslint . --ext ts,tsx,js,jsx --report-unused-disable-directives --max-warnings 0",
|
||||
"prettier": "prettier --write ./src",
|
||||
"check-formatting": "prettier -c ./src"
|
||||
"check-formatting": "prettier -c ./src",
|
||||
"postinstall": "bin/update-workbox.sh"
|
||||
},
|
||||
"dependencies": {
|
||||
"@material-ui/core": "^4.11.4",
|
||||
|
|
@ -46,7 +47,8 @@
|
|||
"react-router-dom": "^5.3.4",
|
||||
"redux": "^4.2.0",
|
||||
"redux-saga": "^1.1.3",
|
||||
"uuid": "^11.0.3"
|
||||
"uuid": "^11.0.3",
|
||||
"workbox-cli": "^7.3.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@testing-library/jest-dom": "^6.6.3",
|
||||
|
|
|
|||
10
ui/public/offline.html
Normal file
10
ui/public/offline.html
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head><title>Navidrome</title></head>
|
||||
<body style="margin:0">
|
||||
<p id="errorMessageDescription" style="text-align:center;font-size:21px;font-family:arial;margin-top:28px">
|
||||
It looks like we are having trouble connecting.
|
||||
<br/>
|
||||
Please check your internet connection and try again.</p>
|
||||
</body>
|
||||
</html>
|
||||
56
ui/src/sw.js
Normal file
56
ui/src/sw.js
Normal file
|
|
@ -0,0 +1,56 @@
|
|||
/* eslint-disable */
|
||||
|
||||
// documentation: https://developers.google.com/web/tools/workbox/modules/workbox-sw
|
||||
importScripts('3rdparty/workbox/workbox-sw.js')
|
||||
|
||||
workbox.setConfig({
|
||||
modulePathPrefix: '3rdparty/workbox/',
|
||||
debug: false,
|
||||
})
|
||||
|
||||
workbox.loadModule('workbox-core')
|
||||
workbox.loadModule('workbox-strategies')
|
||||
workbox.loadModule('workbox-routing')
|
||||
workbox.loadModule('workbox-navigation-preload')
|
||||
|
||||
workbox.core.clientsClaim()
|
||||
self.skipWaiting()
|
||||
|
||||
addEventListener('message', (event) => {
|
||||
if (event.data && event.data.type === 'SKIP_WAITING') {
|
||||
skipWaiting()
|
||||
}
|
||||
})
|
||||
|
||||
const CACHE_NAME = 'offline-html'
|
||||
// This assumes /offline.html is a URL for your self-contained
|
||||
// (no external images or styles) offline page.
|
||||
const FALLBACK_HTML_URL = './offline.html'
|
||||
// Populate the cache with the offline HTML page when the
|
||||
// service worker is installed.
|
||||
self.addEventListener('install', async (event) => {
|
||||
event.waitUntil(
|
||||
caches.open(CACHE_NAME).then((cache) => cache.add(FALLBACK_HTML_URL)),
|
||||
)
|
||||
})
|
||||
|
||||
const networkOnly = new workbox.strategies.NetworkOnly()
|
||||
const navigationHandler = async (params) => {
|
||||
try {
|
||||
// Attempt a network request.
|
||||
return await networkOnly.handle(params)
|
||||
} catch (error) {
|
||||
// If it fails, return the cached HTML.
|
||||
return caches.match(FALLBACK_HTML_URL, {
|
||||
cacheName: CACHE_NAME,
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// self.__WB_MANIFEST is default injection point
|
||||
precacheAndRoute(self.__WB_MANIFEST)
|
||||
|
||||
// Register this strategy to handle all navigations.
|
||||
workbox.routing.registerRoute(
|
||||
new workbox.routing.NavigationRoute(navigationHandler),
|
||||
)
|
||||
|
|
@ -10,10 +10,13 @@ export default defineConfig({
|
|||
plugins: [
|
||||
react(),
|
||||
VitePWA({
|
||||
registerType: 'autoUpdate',
|
||||
manifest: manifest(),
|
||||
workbox: {
|
||||
// Workbox options
|
||||
strategies: 'injectManifest',
|
||||
srcDir: 'src',
|
||||
filename: 'sw.js',
|
||||
devOptions: {
|
||||
enabled: true,
|
||||
type: 'module',
|
||||
},
|
||||
}),
|
||||
],
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue