diff --git a/.eslintrc.json b/.eslintrc.json index adff7ddb..d5fa6408 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,15 +1,16 @@ { - "extends": "@antfu", + "extends": ["@antfu"], "overrides": [ { "files": [ "**/*.md/*.*" ], "rules": { - "@typescript-eslint/no-this-alias": "off", - "n/handle-callback-err": "off", + "no-restricted-imports": "off", "no-restricted-syntax": "off", - "no-labels": "off" + "no-labels": "off", + "@typescript-eslint/no-unused-vars": "off", + "@typescript-eslint/no-var-requires": "off" } } ] diff --git a/.npmrc b/.npmrc new file mode 100644 index 00000000..ce6e56a4 --- /dev/null +++ b/.npmrc @@ -0,0 +1,4 @@ +ignore-workspace-root-check=true +shamefully-hoist=true +strict-peer-dependencies=false +auto-install-peers=true diff --git a/README.md b/README.md index ba35d80d..ed5db0fe 100644 --- a/README.md +++ b/README.md @@ -71,11 +71,11 @@ export default { Read the [📖 documentation](https://vite-plugin-pwa.netlify.app/guide/) for a complete guide on how to configure and use this plugin. -Check out the client type declarations [client.d.ts](./client.d.ts) for built-in frameworks support. +Check out the client type declarations [client.d.ts](packages/vite-plugin-pwa/client.d.ts) for built-in frameworks support. ## 👀 Full config -Check out the type declaration [src/types.ts](./src/types.ts) and the following links for more details. +Check out the type declaration [src/types.ts](packages/vite-plugin-pwa/src/types.ts) and the following links for more details. - [Web app manifests](https://developer.mozilla.org/en-US/docs/Web/Manifest) - [Workbox](https://developers.google.com/web/tools/workbox) diff --git a/docs/.vitepress/components.d.ts b/docs/.vitepress/components.d.ts index 19b7059b..9b2f4709 100644 --- a/docs/.vitepress/components.d.ts +++ b/docs/.vitepress/components.d.ts @@ -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'] @@ -24,5 +26,3 @@ declare module '@vue/runtime-core' { TypeScriptError2307: typeof import('./theme/components/TypeScriptError2307.md')['default'] } } - -export {} diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts index 41fff717..c0edbf7d 100644 --- a/docs/.vitepress/config.ts +++ b/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 = [ { @@ -328,4 +330,10 @@ export default defineConfig({ '/workbox/': prepareSidebar(4), }, }, + vite: { + plugins: [ + pwa(), + ], + }, + buildEnd, }) diff --git a/docs/frameworks/sveltekit.md b/docs/frameworks/sveltekit.md index 0803c5d3..631bd9ad 100644 --- a/docs/frameworks/sveltekit.md +++ b/docs/frameworks/sveltekit.md @@ -63,6 +63,7 @@ Pages which are not prerendered or are generated with a unique adapter will need As an example, when using [@sveltejs/adapter-static](https://github.com/sveltejs/kit/tree/master/packages/adapter-static) with `generateSW` strategy and `Prompt for update` behavior, you will need: ::: details 1) add pwa.js script + ```js import { copyFileSync } from 'fs' import { resolveConfig } from 'vite' @@ -187,6 +188,7 @@ export { pwaConfiguration } ::: ::: details 4) add Vite Plugin PWA to svelte.config.js + ```js import adapter from '@sveltejs/adapter-static' import preprocess from 'svelte-preprocess' diff --git a/docs/guide/development.md b/docs/guide/development.md index 29032624..8555ebeb 100644 --- a/docs/guide/development.md +++ b/docs/guide/development.md @@ -129,7 +129,7 @@ export default defineConfig({ /* other options */ } }) - ] + ] }) ``` ::: diff --git a/docs/guide/faq.md b/docs/guide/faq.md index e49ba581..57c780dd 100644 --- a/docs/guide/faq.md +++ b/docs/guide/faq.md @@ -34,7 +34,9 @@ or `main.js`: import { registerSW } from 'virtual:pwa-register' const updateSW = registerSW({ - onRegisterError(error) {} + onRegisterError(error) { + console.log('error register sw', error) + } }) ``` diff --git a/docs/package.json b/docs/package.json index 16306851..4693af28 100644 --- a/docs/package.json +++ b/docs/package.json @@ -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" } } diff --git a/docs/plugins/navbar.ts b/docs/plugins/navbar.ts index 2954106a..7629b451 100644 --- a/docs/plugins/navbar.ts +++ b/docs/plugins/navbar.ts @@ -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 ` + diff --git a/examples/vue-basic-cdn/package.json b/examples/vue-basic-cdn/package.json index 48367fd5..a196f816 100644 --- a/examples/vue-basic-cdn/package.json +++ b/examples/vue-basic-cdn/package.json @@ -10,16 +10,16 @@ "serve": "serve dist" }, "dependencies": { - "vue": "^3.2.37" + "vue": "^3.2.38" }, "devDependencies": { "@rollup/plugin-replace": "^4.0.0", - "@vitejs/plugin-vue": "^2.3.3", - "@vueuse/core": "^8.7.5", + "@vitejs/plugin-vue": "^3.1.0", + "@vueuse/core": "^9.2.0", "cross-env": "^7.0.3", "https-localhost": "^4.7.1", - "typescript": "^4.7.4", - "vite": "^2.9.13", + "typescript": "^4.8.2", + "vite": "^3.1.0", "vite-plugin-pwa": "workspace:*" } } diff --git a/examples/vue-router/package.json b/examples/vue-router/package.json index 39398011..32f06466 100644 --- a/examples/vue-router/package.json +++ b/examples/vue-router/package.json @@ -43,22 +43,22 @@ "serve": "serve dist" }, "dependencies": { - "vue": "^3.2.37", - "vue-router": "^4.0.16" + "vue": "^3.2.38", + "vue-router": "^4.1.5" }, "devDependencies": { "@rollup/plugin-replace": "^4.0.0", - "@vitejs/plugin-vue": "^2.3.3", - "@vueuse/core": "^8.7.5", + "@vitejs/plugin-vue": "^3.1.0", + "@vueuse/core": "^9.2.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" } } diff --git a/package.json b/package.json index 46edf334..184996b8 100644 --- a/package.json +++ b/package.json @@ -1,8 +1,8 @@ { - "name": "vite-plugin-pwa", + "name": "vite-pwa", "version": "0.12.7", - "packageManager": "pnpm@7.1.8", - "description": "Zero-config PWA for Vite", + "packageManager": "pnpm@7.9.5", + "description": "PWA for Vite", "author": "antfu ", "license": "MIT", "funding": "https://github.com/sponsors/antfu", @@ -25,70 +25,57 @@ "vite", "vite-plugin" ], - "exports": { - ".": { - "types": "./dist/index.d.ts", - "require": "./dist/index.js", - "import": "./dist/index.mjs" - }, - "./*": "./*" - }, - "main": "dist/index.js", - "module": "dist/index.mjs", - "types": "index.d.ts", - "files": [ - "dist", - "*.d.ts" - ], "scripts": { - "docs": "npm -C docs run dev", - "docs:build": "npm -C docs run build", - "docs:serve": "npm -C docs run serve", - "docs:preview": "npm -C docs run preview", + "docs": "pnpm -C docs run dev", + "docs:build": "pnpm -C docs run build", + "docs:serve": "pnpm -C docs run serve", + "docs:preview": "pnpm -C docs run preview", "lint": "eslint .", - "dev": "esno scripts/dev.ts", - "build": "esno scripts/build.ts", - "prepublishOnly": "npm run build", + "lint-fix": "nr lint --fix", + "dev": "pnpm -C packages/vite-plugin-pwa run dev", + "build": "pnpm -r --filter=./packages/** run build", + "prepublishOnly": "nr build", "release": "npx bumpp --push --tag --commit && npm publish", "examples": "esno scripts/run-examples.ts", - "example:vue:dev:cdn": "npm -C examples/vue-basic-cdn run dev", - "example:vue:build:cdn": "npm -C examples/vue-basic-cdn run build", - "example:vue:start:cdn": "npm -C examples/vue-basic-cdn run start" + "example:vue:dev:cdn": "pnpm -C examples/vue-basic-cdn run dev", + "example:vue:build:cdn": "pnpm -C examples/vue-basic-cdn run build", + "example:vue:start:cdn": "pnpm -C examples/vue-basic-cdn run start" }, "peerDependencies": { - "vite": "^2.0.0 || ^3.0.0-0", - "workbox-build": "^6.4.0", - "workbox-window": "^6.4.0" + "vite": "^3.1.0", + "workbox-build": "^6.5.4", + "workbox-window": "^6.5.4" }, "dependencies": { "debug": "^4.3.4", "fast-glob": "^3.2.11", "pretty-bytes": "^6.0.0", - "rollup": "^2.75.7", - "workbox-build": "^6.5.3", - "workbox-window": "^6.5.3" + "rollup": "^2.79.0", + "workbox-build": "^6.5.4", + "workbox-window": "^6.5.4" }, "devDependencies": { - "@antfu/eslint-config": "^0.25.2", - "@antfu/ni": "^0.16.3", + "@antfu/eslint-config": "^0.26.3", + "@antfu/ni": "^0.18.0", "@types/debug": "^4.1.7", "@types/prompts": "^2.4.0", - "@types/react": "^18.0.14", + "@types/node": "^18.7.15", + "@types/react": "^18.0.18", "@types/workbox-build": "^5.0.1", - "@typescript-eslint/eslint-plugin": "^5.30.3", - "eslint": "^8.19.0", - "esno": "^0.14.1", + "@typescript-eslint/eslint-plugin": "^5.36.2", + "eslint": "^8.23.0", + "esno": "0.16.3", "kolorist": "^1.5.1", - "pnpm": "^7.4.1", - "preact": "^10.8.2", + "preact": "^10.10.6", "prompts": "^2.4.2", "react": "^18.2.0", - "rollup": "^2.75.7", - "solid-js": "^1.4.5", - "svelte": "^3.48.0", - "tsup": "^6.1.3", - "typescript": "^4.7.4", - "vite": "^2.9.13", - "vue": "^3.2.37" + "rollup": "^2.79.0", + "solid-js": "^1.5.4", + "svelte": "^3.50.0", + "tsup": "^6.2.3", + "typescript": "^4.8.2", + "unbuild": "^0.8.10", + "vite": "^3.1.0", + "vue": "^3.2.38" } } diff --git a/packages/core/build.config.ts b/packages/core/build.config.ts new file mode 100644 index 00000000..bd0a137d --- /dev/null +++ b/packages/core/build.config.ts @@ -0,0 +1,24 @@ +import { defineBuildConfig } from 'unbuild' + +export default defineBuildConfig({ + entries: [ + 'src/index', + ], + clean: true, + declaration: true, + externals: [ + 'vite', + 'workbox-build', + ], + rollup: { + emitCJS: true, + alias: { + entries: { + 'workbox-build': './node_modules/@types/workbox-build/index.d.ts' + } + }, + dts: { + respectExternal: true, + } + }, +}) diff --git a/packages/core/package.json b/packages/core/package.json new file mode 100644 index 00000000..cd038ee2 --- /dev/null +++ b/packages/core/package.json @@ -0,0 +1,55 @@ +{ + "name": "@vite-pwa/core", + "version": "0.12.7", + "packageManager": "pnpm@7.9.5", + "description": "Vite PWA Core", + "author": "antfu ", + "license": "MIT", + "funding": "https://github.com/sponsors/antfu", + "homepage": "https://github.com/antfu/vite-plugin-pwa", + "repository": { + "type": "git", + "url": "https://github.com/antfu/vite-plugin-pwa" + }, + "bugs": "https://github.com/antfu/vite-plugin-pwa/issues", + "keywords": [ + "react", + "pwa", + "vue", + "vitepress", + "preact", + "svelte", + "sveltekit", + "workbox", + "solidjs", + "vite", + "vite-plugin" + ], + "sideEffects": false, + "exports": { + ".": { + "types": "./dist/index.d.ts", + "require": "./dist/index.cjs", + "import": "./dist/index.mjs" + } + }, + "main": "dist/index.cjs", + "module": "dist/index.mjs", + "types": "dist/index.d.ts", + "files": [ + "dist", + "*.d.ts" + ], + "scripts": { + "build": "unbuild", + "stub": "unbuild --stub" + }, + "dependencies": { + "workbox-build": "^6.5.4" + }, + "devDependencies": { + "@types/node": "^18.7.15", + "@types/workbox-build": "^5.0.1", + "vite": "^3.1.0" + } +} diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts new file mode 100644 index 00000000..b21be123 --- /dev/null +++ b/packages/core/src/index.ts @@ -0,0 +1,13 @@ +import type { ResolvedConfig } from 'vite' +import type { VitePWAOptions } from './types' + +export * from './types' + +async function configureIntegrationOptions( + viteOptions: ResolvedConfig, + userOptions: Partial, +) { + await userOptions?.integration?.configureOptions?.(viteOptions, userOptions) +} + +export { configureIntegrationOptions } diff --git a/packages/core/src/types.ts b/packages/core/src/types.ts new file mode 100644 index 00000000..5909afeb --- /dev/null +++ b/packages/core/src/types.ts @@ -0,0 +1,328 @@ +import type { ResolvedConfig } from 'vite' +import type { GenerateSWOptions, InjectManifestOptions } from 'workbox-build' + +export type InjectManifestVitePlugins = string[] | ((vitePluginIds: string[]) => string[]) +export type CustomInjectManifestOptions = InjectManifestOptions & { + /** + * `Vite` plugin ids to use on `Rollup` build. + * + * **WARN**: this option is for advanced usage, beware, you can break the service worker build. + */ + vitePlugins?: InjectManifestVitePlugins +} + +export type BuildCloseBundleHookOrder = 'pre' | 'post' | null + +export interface PWAIntegration { + closeBundleOrder?: BuildCloseBundleHookOrder + configureOptions?: ( + viteOptions: ResolvedConfig, + options: Partial, + ) => void | Promise +} + +/** + * Plugin options. + */ +export interface VitePWAOptions { + /** + * Build mode + * + * @default process.env.NODE_ENV or "production" + */ + mode?: 'development' | 'production' + /** + * @default 'public' + */ + srcDir?: string + /** + * @default 'dist' + */ + outDir?: string + /** + * @default 'sw.js' + */ + filename?: string + /** + * @default 'manifest.webmanifest' + */ + manifestFilename?: string + /** + * @default 'generateSW' + */ + strategies?: 'generateSW' | 'injectManifest' + /** + * The scope to register the Service Worker + * + * @default same as `base` of Vite's config + */ + scope?: string + /** + * Inject the service worker register inlined in the index.html + * + * With `auto` set, depends on whether you used the `import { registerSW } from 'virtual:pwa-register'` + * it will do nothing or use the `script` mode + * + * `inline` - inject a simple register, inlined with the generated html + * + * `script` - inject