diff --git a/packages/vite/src/node/plugins/importAnalysisBuild.ts b/packages/vite/src/node/plugins/importAnalysisBuild.ts index 4b89085da1e5e6..c3278de7a66097 100644 --- a/packages/vite/src/node/plugins/importAnalysisBuild.ts +++ b/packages/vite/src/node/plugins/importAnalysisBuild.ts @@ -92,57 +92,60 @@ function preload( deps?: string[], importerUrl?: string, ) { + let promise: Promise = Promise.resolve() // @ts-expect-error __VITE_IS_MODERN__ will be replaced with boolean later - if (!__VITE_IS_MODERN__ || !deps || deps.length === 0) { - return baseModule() - } - - const links = document.getElementsByTagName('link') - - return Promise.all( - deps.map((dep) => { - // @ts-expect-error assetsURL is declared before preload.toString() - dep = assetsURL(dep, importerUrl) - if (dep in seen) return - seen[dep] = true - const isCss = dep.endsWith('.css') - const cssSelector = isCss ? '[rel="stylesheet"]' : '' - const isBaseRelative = !!importerUrl - - // check if the file is already preloaded by SSR markup - if (isBaseRelative) { - // When isBaseRelative is true then we have `importerUrl` and `dep` is - // already converted to an absolute URL by the `assetsURL` function - for (let i = links.length - 1; i >= 0; i--) { - const link = links[i] - // The `links[i].href` is an absolute URL thanks to browser doing the work - // for us. See https://html.spec.whatwg.org/multipage/common-dom-interfaces.html#reflecting-content-attributes-in-idl-attributes:idl-domstring-5 - if (link.href === dep && (!isCss || link.rel === 'stylesheet')) { - return + if (__VITE_IS_MODERN__ && deps && deps.length > 0) { + const links = document.getElementsByTagName('link') + + promise = Promise.all( + deps.map((dep) => { + // @ts-expect-error assetsURL is declared before preload.toString() + dep = assetsURL(dep, importerUrl) + if (dep in seen) return + seen[dep] = true + const isCss = dep.endsWith('.css') + const cssSelector = isCss ? '[rel="stylesheet"]' : '' + const isBaseRelative = !!importerUrl + + // check if the file is already preloaded by SSR markup + if (isBaseRelative) { + // When isBaseRelative is true then we have `importerUrl` and `dep` is + // already converted to an absolute URL by the `assetsURL` function + for (let i = links.length - 1; i >= 0; i--) { + const link = links[i] + // The `links[i].href` is an absolute URL thanks to browser doing the work + // for us. See https://html.spec.whatwg.org/multipage/common-dom-interfaces.html#reflecting-content-attributes-in-idl-attributes:idl-domstring-5 + if (link.href === dep && (!isCss || link.rel === 'stylesheet')) { + return + } } + } else if ( + document.querySelector(`link[href="${dep}"]${cssSelector}`) + ) { + return } - } else if (document.querySelector(`link[href="${dep}"]${cssSelector}`)) { - return - } - const link = document.createElement('link') - link.rel = isCss ? 'stylesheet' : scriptRel - if (!isCss) { - link.as = 'script' - link.crossOrigin = '' - } - link.href = dep - document.head.appendChild(link) - if (isCss) { - return new Promise((res, rej) => { - link.addEventListener('load', res) - link.addEventListener('error', () => - rej(new Error(`Unable to preload CSS for ${dep}`)), - ) - }) - } - }), - ) + const link = document.createElement('link') + link.rel = isCss ? 'stylesheet' : scriptRel + if (!isCss) { + link.as = 'script' + link.crossOrigin = '' + } + link.href = dep + document.head.appendChild(link) + if (isCss) { + return new Promise((res, rej) => { + link.addEventListener('load', res) + link.addEventListener('error', () => + rej(new Error(`Unable to preload CSS for ${dep}`)), + ) + }) + } + }), + ) + } + + return promise .then(() => baseModule()) .catch((err) => { const e = new Event('vite:preloadError', { cancelable: true }) diff --git a/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts b/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts index b4e63e66290a74..d4e6888ab5edd8 100644 --- a/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts +++ b/playground/js-sourcemap/__tests__/js-sourcemap.spec.ts @@ -116,7 +116,7 @@ describe.runIf(isBuild)('build tests', () => { const map = findAssetFile(/after-preload-dynamic.*\.js\.map/) expect(formatSourcemapForSnapshot(JSON.parse(map))).toMatchInlineSnapshot(` { - "mappings": "k2BAAA,OAAO,2BAAuB,EAAC,wBAE/B,QAAQ,IAAI,uBAAuB", + "mappings": "i3BAAA,OAAO,2BAAuB,EAAC,wBAE/B,QAAQ,IAAI,uBAAuB", "sources": [ "../../after-preload-dynamic.js", ],