From c88692c663b67318478b7b11652cb22d6e389c99 Mon Sep 17 00:00:00 2001 From: bluwy Date: Tue, 25 Apr 2023 17:23:54 +0800 Subject: [PATCH 1/4] fix(worker): prevent load vite client --- packages/vite/src/client/client.ts | 18 --------- packages/vite/src/client/overlay.ts | 4 -- .../vite/src/node/plugins/importAnalysis.ts | 37 ++++++++++++++++++- 3 files changed, 36 insertions(+), 23 deletions(-) diff --git a/packages/vite/src/client/client.ts b/packages/vite/src/client/client.ts index 0c3163adfb1c06..57a664b8135697 100644 --- a/packages/vite/src/client/client.ts +++ b/packages/vite/src/client/client.ts @@ -591,22 +591,4 @@ export function createHotContext(ownerPath: string): ViteHotContext { return hot } -/** - * urls here are dynamic import() urls that couldn't be statically analyzed - */ -export function injectQuery(url: string, queryToInject: string): string { - // skip urls that won't be handled by vite - if (url[0] !== '.' && url[0] !== '/') { - return url - } - - // can't use pathname from URL since it may be relative like ../ - const pathname = url.replace(/#.*$/, '').replace(/\?.*$/, '') - const { search, hash } = new URL(url, 'http://vitejs.dev') - - return `${pathname}?${queryToInject}${search ? `&` + search.slice(1) : ''}${ - hash || '' - }` -} - export { ErrorOverlay } diff --git a/packages/vite/src/client/overlay.ts b/packages/vite/src/client/overlay.ts index 30e0abf07267b5..e750795ae7a55d 100644 --- a/packages/vite/src/client/overlay.ts +++ b/packages/vite/src/client/overlay.ts @@ -135,9 +135,6 @@ code { const fileRE = /(?:[a-zA-Z]:\\|\/).*?:\d+:\d+/g const codeframeRE = /^(?:>?\s+\d+\s+\|.*|\s+\|\s*\^.*)\r?\n/gm -// Allow `ErrorOverlay` to extend `HTMLElement` even in environments where -// `HTMLElement` was not originally defined. -const { HTMLElement = class {} as typeof globalThis.HTMLElement } = globalThis export class ErrorOverlay extends HTMLElement { root: ShadowRoot @@ -208,7 +205,6 @@ export class ErrorOverlay extends HTMLElement { } export const overlayId = 'vite-error-overlay' -const { customElements } = globalThis // Ensure `customElements` is defined before the next line. if (customElements && !customElements.get(overlayId)) { customElements.define(overlayId, ErrorOverlay) } diff --git a/packages/vite/src/node/plugins/importAnalysis.ts b/packages/vite/src/node/plugins/importAnalysis.ts index 119f0192cabb43..35cad538f96d68 100644 --- a/packages/vite/src/node/plugins/importAnalysis.ts +++ b/packages/vite/src/node/plugins/importAnalysis.ts @@ -80,6 +80,27 @@ const hasViteIgnoreRE = /\/\*\s*@vite-ignore\s*\*\// const cleanUpRawUrlRE = /\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm const urlIsStringRE = /^(?:'.*'|".*"|`.*`)$/ +const importAnalysisHelperId = '\0vite/import-analysis-helper' + +/** + * urls here are dynamic import() urls that couldn't be statically analyzed. + * browser-safe version of `injectQuery` util. + */ +function __vite__injectQuery(url: string, queryToInject: string): string { + // skip urls that won't be handled by vite + if (url[0] !== '.' && url[0] !== '/') { + return url + } + + // can't use pathname from URL since it may be relative like ../ + const pathname = url.replace(/#.*$/, '').replace(/\?.*$/, '') + const { search, hash } = new URL(url, 'http://vitejs.dev') + + return `${pathname}?${queryToInject}${search ? `&` + search.slice(1) : ''}${ + hash || '' + }` +} + interface UrlPosition { url: string start: number @@ -201,6 +222,18 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin { server = _server }, + resolveId(id) { + if (id === importAnalysisHelperId) { + return id + } + }, + + load(id) { + if (id === importAnalysisHelperId) { + return 'export ' + __vite__injectQuery.toString() + } + }, + async transform(source, importer, options) { // In a real app `server` is always defined, but it is undefined when // running src/node/server/__tests__/pluginContainer.spec.ts @@ -734,7 +767,9 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin { if (needQueryInjectHelper) { str().prepend( - `import { injectQuery as __vite__injectQuery } from "${clientPublicPath}";`, + `import { __vite__injectQuery } from "${wrapId( + importAnalysisHelperId, + )}";`, ) } From 7808ced8837a422281848dfa3ddb8f361d806a5b Mon Sep 17 00:00:00 2001 From: bluwy Date: Tue, 25 Apr 2023 17:26:28 +0800 Subject: [PATCH 2/4] chore: wrap --- packages/vite/src/node/plugins/importAnalysis.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/vite/src/node/plugins/importAnalysis.ts b/packages/vite/src/node/plugins/importAnalysis.ts index 35cad538f96d68..98fcc1e6a4bdc2 100644 --- a/packages/vite/src/node/plugins/importAnalysis.ts +++ b/packages/vite/src/node/plugins/importAnalysis.ts @@ -81,6 +81,7 @@ const cleanUpRawUrlRE = /\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm const urlIsStringRE = /^(?:'.*'|".*"|`.*`)$/ const importAnalysisHelperId = '\0vite/import-analysis-helper' +const wrapppedImportAnalysisHelperId = wrapId(importAnalysisHelperId) /** * urls here are dynamic import() urls that couldn't be statically analyzed. @@ -767,9 +768,7 @@ export function importAnalysisPlugin(config: ResolvedConfig): Plugin { if (needQueryInjectHelper) { str().prepend( - `import { __vite__injectQuery } from "${wrapId( - importAnalysisHelperId, - )}";`, + `import { __vite__injectQuery } from "${wrapppedImportAnalysisHelperId}";`, ) } From 3f324aa55b3852fb73026ec16cfdb7fd58d8374f Mon Sep 17 00:00:00 2001 From: bluwy Date: Wed, 26 Apr 2023 15:00:56 +0800 Subject: [PATCH 3/4] chore: revert overlay change --- packages/vite/src/client/overlay.ts | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/vite/src/client/overlay.ts b/packages/vite/src/client/overlay.ts index e750795ae7a55d..30e0abf07267b5 100644 --- a/packages/vite/src/client/overlay.ts +++ b/packages/vite/src/client/overlay.ts @@ -135,6 +135,9 @@ code { const fileRE = /(?:[a-zA-Z]:\\|\/).*?:\d+:\d+/g const codeframeRE = /^(?:>?\s+\d+\s+\|.*|\s+\|\s*\^.*)\r?\n/gm +// Allow `ErrorOverlay` to extend `HTMLElement` even in environments where +// `HTMLElement` was not originally defined. +const { HTMLElement = class {} as typeof globalThis.HTMLElement } = globalThis export class ErrorOverlay extends HTMLElement { root: ShadowRoot @@ -205,6 +208,7 @@ export class ErrorOverlay extends HTMLElement { } export const overlayId = 'vite-error-overlay' +const { customElements } = globalThis // Ensure `customElements` is defined before the next line. if (customElements && !customElements.get(overlayId)) { customElements.define(overlayId, ErrorOverlay) } From 36e6194161015509d182062b0494f960173996d2 Mon Sep 17 00:00:00 2001 From: bluwy Date: Wed, 26 Apr 2023 15:02:33 +0800 Subject: [PATCH 4/4] fix: guard document for workers Co-authored-by: patak --- packages/vite/src/client/client.ts | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/packages/vite/src/client/client.ts b/packages/vite/src/client/client.ts index 57a664b8135697..a8801e616a59d1 100644 --- a/packages/vite/src/client/client.ts +++ b/packages/vite/src/client/client.ts @@ -365,9 +365,11 @@ const sheetsMap = new Map() // collect existing style elements that may have been inserted during SSR // to avoid FOUC or duplicate styles -document.querySelectorAll('style[data-vite-dev-id]').forEach((el) => { - sheetsMap.set(el.getAttribute('data-vite-dev-id')!, el as HTMLStyleElement) -}) +if ('document' in globalThis) { + document.querySelectorAll('style[data-vite-dev-id]').forEach((el) => { + sheetsMap.set(el.getAttribute('data-vite-dev-id')!, el as HTMLStyleElement) + }) +} // all css imports should be inserted at the same position // because after build it will be a single css file