-
Notifications
You must be signed in to change notification settings - Fork 169
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
refactor: use Vite official API for building sw.js #20894
base: main
Are you sure you want to change the base?
Changes from all commits
4687227
2e72c30
94b5a42
c568ab3
0bcc85c
f2882af
bef6e12
9406727
dbbda36
cd1eb06
2ab63d1
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -16,18 +16,18 @@ import settings from '#settingsImport#'; | |
import { | ||
AssetInfo, | ||
ChunkInfo, | ||
build, | ||
defineConfig, | ||
mergeConfig, | ||
OutputOptions, | ||
PluginOption, | ||
ResolvedConfig, | ||
InlineConfig, | ||
UserConfigFn | ||
} from 'vite'; | ||
import { getManifest, type ManifestTransform } from 'workbox-build'; | ||
|
||
import * as rollup from 'rollup'; | ||
import brotli from 'rollup-plugin-brotli'; | ||
import replace from '@rollup/plugin-replace'; | ||
import checker from 'vite-plugin-checker'; | ||
import postcssLit from '#buildFolder#/plugins/rollup-plugin-postcss-lit-custom/rollup-plugin-postcss-lit.js'; | ||
|
||
|
@@ -106,7 +106,7 @@ function injectManifestToSWPlugin(): rollup.Plugin { | |
const { manifestEntries } = await getManifest({ | ||
globDirectory: buildOutputFolder, | ||
globPatterns: ['**/*'], | ||
globIgnores: ['**/*.br', 'pwa-icons/**'], | ||
globIgnores: ['**/*.br', 'pwa-icons/**', 'sw.js'], | ||
manifestTransforms: [rewriteManifestIndexHtmlUrl], | ||
maximumFileSizeToCacheInBytes: 100 * 1024 * 1024 // 100mb, | ||
}); | ||
|
@@ -118,87 +118,54 @@ function injectManifestToSWPlugin(): rollup.Plugin { | |
} | ||
|
||
function buildSWPlugin(opts: { devMode: boolean }): PluginOption { | ||
let config: ResolvedConfig; | ||
let buildConfig: InlineConfig; | ||
const devMode = opts.devMode; | ||
|
||
const swObj: { code?: string, map?: rollup.SourceMap | null } = {}; | ||
|
||
async function build(action: 'generate' | 'write', additionalPlugins: rollup.Plugin[] = []) { | ||
const includedPluginNames = [ | ||
'vite:esbuild', | ||
'rollup-plugin-dynamic-import-variables', | ||
'vite:esbuild-transpile', | ||
'vite:terser' | ||
]; | ||
const plugins: rollup.Plugin[] = config.plugins.filter((p) => { | ||
return includedPluginNames.includes(p.name); | ||
}); | ||
const resolver = config.createResolver(); | ||
const resolvePlugin: rollup.Plugin = { | ||
name: 'resolver', | ||
resolveId(source, importer, _options) { | ||
return resolver(source, importer); | ||
} | ||
}; | ||
plugins.unshift(resolvePlugin); // Put resolve first | ||
plugins.push( | ||
replace({ | ||
values: { | ||
'process.env.NODE_ENV': JSON.stringify(config.mode), | ||
...config.define | ||
}, | ||
preventAssignment: true | ||
}) | ||
); | ||
if (additionalPlugins) { | ||
plugins.push(...additionalPlugins); | ||
} | ||
const bundle = await rollup.rollup({ | ||
input: path.resolve(settings.clientServiceWorkerSource), | ||
plugins | ||
}); | ||
|
||
try { | ||
return await bundle[action]({ | ||
file: path.resolve(buildOutputFolder, 'sw.js'), | ||
format: 'es', | ||
exports: 'none', | ||
sourcemap: config.command === 'serve' || config.build.sourcemap, | ||
inlineDynamicImports: true | ||
}); | ||
} finally { | ||
await bundle.close(); | ||
} | ||
} | ||
|
||
return { | ||
name: 'vaadin:build-sw', | ||
enforce: 'post', | ||
async configResolved(resolvedConfig) { | ||
config = resolvedConfig; | ||
async configResolved(viteConfig) { | ||
buildConfig = { | ||
base: viteConfig.base, | ||
root: viteConfig.root, | ||
mode: viteConfig.mode, | ||
resolve: viteConfig.resolve, | ||
define: { | ||
...viteConfig.define, | ||
'process.env.NODE_ENV': JSON.stringify(viteConfig.mode), | ||
}, | ||
build: { | ||
minify: viteConfig.build.minify, | ||
outDir: viteConfig.build.outDir, | ||
sourcemap: viteConfig.command === 'serve' || viteConfig.build.sourcemap, | ||
emptyOutDir: false, | ||
modulePreload: false, | ||
rollupOptions: { | ||
input: { | ||
sw: settings.clientServiceWorkerSource | ||
}, | ||
output: { | ||
exports: 'none', | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. note: This option is untested, but that can be addressed separately since it's coming from the previous config. |
||
entryFileNames: 'sw.js', | ||
inlineDynamicImports: true, | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. note: This option is untested, but that can be addressed separately since it's coming from the previous config. |
||
}, | ||
}, | ||
}, | ||
}; | ||
}, | ||
async buildStart() { | ||
if (devMode) { | ||
const { output } = await build('generate'); | ||
swObj.code = output[0].code; | ||
swObj.map = output[0].map; | ||
} | ||
}, | ||
async load(id) { | ||
if (id.endsWith('sw.js')) { | ||
return ''; | ||
} | ||
}, | ||
async transform(_code, id) { | ||
if (id.endsWith('sw.js')) { | ||
return swObj; | ||
await build(buildConfig); | ||
} | ||
}, | ||
async closeBundle() { | ||
if (!devMode) { | ||
await build('write', [injectManifestToSWPlugin(), brotli()]); | ||
await build({ | ||
...buildConfig, | ||
plugins: [injectManifestToSWPlugin(), brotli()] | ||
}); | ||
} | ||
} | ||
}, | ||
}; | ||
} | ||
|
||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
note: Added this line to prevent
sw.js
from being included in the manifest when the production bundle is built after the development bundle. Previously, this didn't happen becausesw.js
existed only virtually in dev mode.