Skip to content

Commit

Permalink
feat!: support for Vite 3.1 (#371)
Browse files Browse the repository at this point in the history
  • Loading branch information
userquin committed Sep 20, 2022
1 parent 79a929e commit 4a9e8b9
Show file tree
Hide file tree
Showing 32 changed files with 2,601 additions and 3,060 deletions.
2 changes: 1 addition & 1 deletion .eslintrc.json
@@ -1,5 +1,5 @@
{
"extends": "@antfu",
"extends": ["@antfu"],
"overrides": [
{
"files": [
Expand Down
4 changes: 4 additions & 0 deletions .npmrc
@@ -0,0 +1,4 @@
ignore-workspace-root-check=true
shamefully-hoist=true
strict-peer-dependencies=false
auto-install-peers=true
4 changes: 2 additions & 2 deletions docs/.vitepress/components.d.ts
Expand Up @@ -3,6 +3,8 @@
// Read more: https://github.com/vuejs/core/pull/3399
import '@vue/runtime-core'

export {}

declare module '@vue/runtime-core' {
export interface GlobalComponents {
CleanupOutdatedCaches: typeof import('./theme/components/CleanupOutdatedCaches.md')['default']
Expand All @@ -24,5 +26,3 @@ declare module '@vue/runtime-core' {
TypeScriptError2307: typeof import('./theme/components/TypeScriptError2307.md')['default']
}
}

export {}
8 changes: 8 additions & 0 deletions docs/.vitepress/config.ts
@@ -1,5 +1,7 @@
import { defineConfig } from 'vitepress'
import { version } from '../../package.json'
import { pwa } from '../scripts/pwa'
import { buildEnd } from '../scripts/build'

const Guide = [
{
Expand Down Expand Up @@ -328,4 +330,10 @@ export default defineConfig({
'/workbox/': prepareSidebar(4),
},
},
vite: {
plugins: [
pwa(),
],
},
buildEnd,
})
2 changes: 1 addition & 1 deletion docs/guide/development.md
Expand Up @@ -129,7 +129,7 @@ export default defineConfig({
/* other options */
}
})
]
]
})
```
:::
Expand Down
34 changes: 17 additions & 17 deletions docs/guide/periodic-sw-updates.md
Expand Up @@ -47,23 +47,23 @@ import { registerSW } from 'virtual:pwa-register'
const intervalMS = 60 * 60 * 1000

const updateSW = registerSW({
onRegisteredSW(swUrl, r) {
r && setInterval(async () => {
if (!(!r.installing && navigator))
return
if (('connection' in navigator) && !navigator.onLine)
return

const resp = await fetch(swUrl, {
cache: 'no-store',
'cache-control': 'no-cache'
})

if (resp?.status === 200)
await r.update()
}, intervalMS)
}
onRegisteredSW(swUrl, r) {
r && setInterval(async () => {
if (!(!r.installing && navigator))
return

if (('connection' in navigator) && !navigator.onLine)
return

const resp = await fetch(swUrl, {
'cache': 'no-store',
'cache-control': 'no-cache'
})

if (resp?.status === 200)
await r.update()
}, intervalMS)
}
})
```
:::
Expand Down
24 changes: 12 additions & 12 deletions docs/package.json
Expand Up @@ -9,25 +9,25 @@
"serve": "npm run build && serve .vitepress/dist"
},
"dependencies": {
"@vueuse/core": "^8.7.5",
"@vueuse/shared": "^8.7.5",
"vue": "^3.2.37"
"@vueuse/core": "^9.2.0",
"@vueuse/shared": "^9.2.0",
"vue": "^3.2.38"
},
"devDependencies": {
"@types/fs-extra": "^9.0.13",
"@vitejs/plugin-vue": "^2.3.3",
"@vueuse/core": "^8.7.5",
"@vitejs/plugin-vue": "^3.1.0",
"@vueuse/core": "^9.2.0",
"esbuild-register": "^3.3.3",
"eslint": "^8.19.0",
"eslint": "^8.23.0",
"fast-glob": "^3.2.11",
"fs-extra": "^10.1.0",
"https-localhost": "^4.7.1",
"typescript": "^4.7.4",
"unocss": "^0.38.2",
"unplugin-vue-components": "^0.19.9",
"vite": "^2.9.13",
"typescript": "^4.8.2",
"unocss": "^0.45.18",
"unplugin-vue-components": "^0.22.4",
"vite": "^3.1.0",
"vite-plugin-pwa": "workspace:*",
"vitepress": "^1.0.0-alpha.4",
"workbox-window": "^6.5.3"
"vitepress": "^1.0.0-alpha.13",
"workbox-window": "^6.5.4"
}
}
2 changes: 1 addition & 1 deletion docs/plugins/navbar.ts
Expand Up @@ -5,7 +5,7 @@ export default function NavbarFix(): Plugin {
name: 'vitepress-sidebar-logo-fix',
enforce: 'pre',
transform(code, id) {
if (id.includes('VPNavBarTitle.vue') && !id.endsWith('.css')) {
if (id.includes('VPNavBarTitle.vue') && !id.endsWith('.css') && !id.includes('&setup=')) {
return `
<script setup lang="ts">
import { useData } from 'vitepress'
Expand Down
14 changes: 6 additions & 8 deletions docs/scripts/build.ts
@@ -1,15 +1,13 @@
import { resolveConfig } from 'vite'
import type { VitePluginPWAAPI } from '../../dist'
import type { VitePluginPWAAPI } from 'vite-plugin-pwa'
import { optimizePages } from './assets'
import { pwa } from './pwa'

const rebuildPwa = async () => {
const config = await resolveConfig({}, 'build', 'production')
export const buildEnd = async () => {
await optimizePages()
const config = await resolveConfig({ plugins: [pwa()] }, 'build', 'production')
// when `vite-plugin-pwa` is presented, use it to regenerate SW after rendering
const pwaPlugin: VitePluginPWAAPI = config.plugins.find(i => i.name === 'vite-plugin-pwa')?.api
if (pwaPlugin && pwaPlugin.generateSW && !pwaPlugin.disabled) {
await optimizePages()
if (pwaPlugin && pwaPlugin.generateSW && !pwaPlugin.disabled)
await pwaPlugin.generateSW()
}
}

rebuildPwa()
81 changes: 81 additions & 0 deletions docs/scripts/pwa.ts
@@ -0,0 +1,81 @@
import { VitePWA } from 'vite-plugin-pwa'

export const pwa = () => {
return VitePWA({
outDir: '.vitepress/dist',
registerType: 'prompt',
includeManifestIcons: false,
manifest: {
id: '/',
name: 'Vite Plugin PWA',
short_name: 'PWA for Vite',
description: 'Zero-config PWA for Vite',
theme_color: '#ffffff',
icons: [
{
src: 'pwa-192x192.png',
sizes: '192x192',
type: 'image/png',
},
{
src: 'pwa-512x512.png',
sizes: '512x512',
type: 'image/png',
},
{
src: 'icon_light.svg',
sizes: '155x155',
type: 'image/svg',
purpose: 'any maskable',
},
],
},
workbox: {
globPatterns: ['**/*.{css,js,html,svg,png,ico,txt,woff2}'],
runtimeCaching: [
{
urlPattern: /^https:\/\/fonts\.googleapis\.com\/.*/i,
handler: 'CacheFirst',
options: {
cacheName: 'google-fonts-cache',
expiration: {
maxEntries: 10,
maxAgeSeconds: 60 * 60 * 24 * 365, // <== 365 days
},
cacheableResponse: {
statuses: [0, 200],
},
},
},
{
urlPattern: /^https:\/\/fonts\.gstatic\.com\/.*/i,
handler: 'CacheFirst',
options: {
cacheName: 'gstatic-fonts-cache',
expiration: {
maxEntries: 10,
maxAgeSeconds: 60 * 60 * 24 * 365, // <== 365 days
},
cacheableResponse: {
statuses: [0, 200],
},
},
},
{
urlPattern: /^https:\/\/cdn\.jsdelivr\.net\/.*/i,
handler: 'NetworkFirst',
options: {
cacheName: 'jsdelivr-images-cache',
expiration: {
maxEntries: 10,
maxAgeSeconds: 60 * 60 * 24 * 7, // <== 7 days
},
cacheableResponse: {
statuses: [0, 200],
},
},
},
],
},
})
}
87 changes: 7 additions & 80 deletions docs/vite.config.ts
Expand Up @@ -2,10 +2,15 @@ import { defineConfig } from 'vite'
import Components from 'unplugin-vue-components/vite'
import { presetAttributify, presetUno } from 'unocss'
import Unocss from 'unocss/vite'
import { VitePWA } from '../dist'
import NavbarFix from './plugins/navbar'

export default defineConfig({
ssr: {
format: 'cjs',
},
legacy: {
buildSsrCjsExternalHeuristics: true,
},
build: {
// sourcemap: true,
// minify: false,
Expand All @@ -15,6 +20,7 @@ export default defineConfig({
optimizeDeps: {
exclude: [
'@vueuse/core',
'vitepress',
],
},
server: {
Expand Down Expand Up @@ -44,84 +50,5 @@ export default defineConfig({
Unocss({
presets: [presetUno(), presetAttributify()],
}),

// https://github.com/antfu/vite-plugin-pwa
VitePWA({
outDir: '.vitepress/dist',
registerType: 'prompt',
includeManifestIcons: false,
manifest: {
id: '/',
name: 'Vite Plugin PWA',
short_name: 'PWA for Vite',
description: 'Zero-config PWA for Vite',
theme_color: '#ffffff',
icons: [
{
src: 'pwa-192x192.png',
sizes: '192x192',
type: 'image/png',
},
{
src: 'pwa-512x512.png',
sizes: '512x512',
type: 'image/png',
},
{
src: 'icon_light.svg',
sizes: '155x155',
type: 'image/svg',
purpose: 'any maskable',
},
],
},
workbox: {
globPatterns: ['**/*.{css,js,html,svg,png,ico,txt,woff2}'],
runtimeCaching: [
{
urlPattern: /^https:\/\/fonts\.googleapis\.com\/.*/i,
handler: 'CacheFirst',
options: {
cacheName: 'google-fonts-cache',
expiration: {
maxEntries: 10,
maxAgeSeconds: 60 * 60 * 24 * 365, // <== 365 days
},
cacheableResponse: {
statuses: [0, 200],
},
},
},
{
urlPattern: /^https:\/\/fonts\.gstatic\.com\/.*/i,
handler: 'CacheFirst',
options: {
cacheName: 'gstatic-fonts-cache',
expiration: {
maxEntries: 10,
maxAgeSeconds: 60 * 60 * 24 * 365, // <== 365 days
},
cacheableResponse: {
statuses: [0, 200],
},
},
},
{
urlPattern: /^https:\/\/cdn\.jsdelivr\.net\/.*/i,
handler: 'NetworkFirst',
options: {
cacheName: 'jsdelivr-images-cache',
expiration: {
maxEntries: 10,
maxAgeSeconds: 60 * 60 * 24 * 7, // <== 7 days
},
cacheableResponse: {
statuses: [0, 200],
},
},
},
],
},
}),
],
})
18 changes: 9 additions & 9 deletions examples/preact-router/package.json
Expand Up @@ -43,21 +43,21 @@
"serve": "serve dist"
},
"dependencies": {
"preact": "^10.8.2",
"preact-router": "^4.0.1"
"preact": "^10.10.6",
"preact-router": "^4.1.0"
},
"devDependencies": {
"@preact/preset-vite": "^2.3.0",
"@preact/preset-vite": "^2.3.1",
"@rollup/plugin-replace": "^4.0.0",
"cross-env": "^7.0.3",
"https-localhost": "^4.7.1",
"rimraf": "^3.0.2",
"typescript": "^4.7.4",
"vite": "^2.9.13",
"typescript": "^4.8.2",
"vite": "^3.1.0",
"vite-plugin-pwa": "workspace:*",
"workbox-core": "^6.5.3",
"workbox-precaching": "^6.5.3",
"workbox-routing": "^6.5.3",
"workbox-window": "^6.5.3"
"workbox-core": "^6.5.4",
"workbox-precaching": "^6.5.4",
"workbox-routing": "^6.5.4",
"workbox-window": "^6.5.4"
}
}
1 change: 1 addition & 0 deletions examples/preact-router/src/ReloadPrompt.tsx
Expand Up @@ -3,6 +3,7 @@ import './ReloadPrompt.css'
import { useRegisterSW } from 'virtual:pwa-register/preact'
import { pwaInfo } from 'virtual:pwa-info'

// eslint-disable-next-line no-console
console.log(pwaInfo)

function ReloadPrompt() {
Expand Down

0 comments on commit 4a9e8b9

Please sign in to comment.