From 1bd429cf550a54c0307a3a49af360aeebd4ccaba Mon Sep 17 00:00:00 2001 From: Richard Petersen Date: Tue, 20 Apr 2021 10:57:05 +0200 Subject: [PATCH 1/3] fix: preload paths with different production base path breaks --- packages/vite/src/node/plugins/importAnalysisBuild.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/vite/src/node/plugins/importAnalysisBuild.ts b/packages/vite/src/node/plugins/importAnalysisBuild.ts index 8ba83f3ea89dd1..9e2f0bc8572e86 100644 --- a/packages/vite/src/node/plugins/importAnalysisBuild.ts +++ b/packages/vite/src/node/plugins/importAnalysisBuild.ts @@ -267,7 +267,9 @@ export function buildImportAnalysisPlugin(config: ResolvedConfig): Plugin { // the dep list includes the main chunk, so only need to // preload when there are actual other deps. deps.size > 1 - ? `[${[...deps].map((d) => JSON.stringify(d)).join(',')}]` + ? `[${[...deps] + .map((d) => JSON.stringify(d.replace(/^\//, './'))) + .join(',')}]` : `void 0` ) } From 2d42d0fcf7f79170f5aee2ce3f9509746c37c6f5 Mon Sep 17 00:00:00 2001 From: Richard Petersen Date: Tue, 20 Apr 2021 18:20:54 +0200 Subject: [PATCH 2/3] fix: add inline comment --- packages/vite/src/node/plugins/importAnalysisBuild.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/vite/src/node/plugins/importAnalysisBuild.ts b/packages/vite/src/node/plugins/importAnalysisBuild.ts index 9e2f0bc8572e86..16be1f9d760604 100644 --- a/packages/vite/src/node/plugins/importAnalysisBuild.ts +++ b/packages/vite/src/node/plugins/importAnalysisBuild.ts @@ -268,6 +268,7 @@ export function buildImportAnalysisPlugin(config: ResolvedConfig): Plugin { // preload when there are actual other deps. deps.size > 1 ? `[${[...deps] + // replace leading slashes to ensure a relative path. See https://github.com/vitejs/vite/pull/3061 .map((d) => JSON.stringify(d.replace(/^\//, './'))) .join(',')}]` : `void 0` From b6fbb4a41732e380dc9a7250f5e8c4a1b2eb1b08 Mon Sep 17 00:00:00 2001 From: Richard Petersen Date: Sun, 2 May 2021 16:36:38 +0200 Subject: [PATCH 3/3] fix: different production base path does not work add test-case which uses a base-path --- .../base-path/__tests__/base-path.spec.ts | 14 +++++++++++ packages/playground/base-path/dep.js | 5 ++++ packages/playground/base-path/index.html | 4 ++++ packages/playground/base-path/main.js | 4 ++++ packages/playground/base-path/package.json | 11 +++++++++ packages/playground/base-path/preload.js | 3 +++ packages/playground/base-path/vite.config.js | 24 +++++++++++++++++++ .../src/node/plugins/importAnalysisBuild.ts | 11 ++++----- 8 files changed, 70 insertions(+), 6 deletions(-) create mode 100644 packages/playground/base-path/__tests__/base-path.spec.ts create mode 100644 packages/playground/base-path/dep.js create mode 100644 packages/playground/base-path/index.html create mode 100644 packages/playground/base-path/main.js create mode 100644 packages/playground/base-path/package.json create mode 100644 packages/playground/base-path/preload.js create mode 100644 packages/playground/base-path/vite.config.js diff --git a/packages/playground/base-path/__tests__/base-path.spec.ts b/packages/playground/base-path/__tests__/base-path.spec.ts new file mode 100644 index 00000000000000..3003213c53cb30 --- /dev/null +++ b/packages/playground/base-path/__tests__/base-path.spec.ts @@ -0,0 +1,14 @@ +import { readFile, untilUpdated, isBuild } from '../../testUtils' + +test('should work', async () => { + await page.click('.clickme') + await untilUpdated(() => page.textContent('.content'), '3', true) +}) + +if (isBuild) { + test('should have relative path', async () => { + expect(readFile('dist/foo/assets/index.js')).toMatch( + /.*\.\/assets\/preload\.js.*/ + ) + }) +} diff --git a/packages/playground/base-path/dep.js b/packages/playground/base-path/dep.js new file mode 100644 index 00000000000000..ceba2075064d12 --- /dev/null +++ b/packages/playground/base-path/dep.js @@ -0,0 +1,5 @@ +import preload from './preload' + +export function test() { + return 1 + preload() +} diff --git a/packages/playground/base-path/index.html b/packages/playground/base-path/index.html new file mode 100644 index 00000000000000..0c022aeddfc4c5 --- /dev/null +++ b/packages/playground/base-path/index.html @@ -0,0 +1,4 @@ + + + +
diff --git a/packages/playground/base-path/main.js b/packages/playground/base-path/main.js new file mode 100644 index 00000000000000..273c9bb7ffa466 --- /dev/null +++ b/packages/playground/base-path/main.js @@ -0,0 +1,4 @@ +document.querySelector('.clickme').addEventListener('click', async () => { + const { test } = await import('./dep.js') + document.querySelector('.content').textContent = test() +}) diff --git a/packages/playground/base-path/package.json b/packages/playground/base-path/package.json new file mode 100644 index 00000000000000..28fe91d2c98fe3 --- /dev/null +++ b/packages/playground/base-path/package.json @@ -0,0 +1,11 @@ +{ + "name": "base-path", + "private": true, + "version": "0.0.0", + "scripts": { + "dev": "vite", + "build": "vite build", + "debug": "node --inspect-brk ../../vite/bin/vite", + "serve": "vite preview" + } +} diff --git a/packages/playground/base-path/preload.js b/packages/playground/base-path/preload.js new file mode 100644 index 00000000000000..ef8bd729e9f926 --- /dev/null +++ b/packages/playground/base-path/preload.js @@ -0,0 +1,3 @@ +export default function () { + return 2 +} diff --git a/packages/playground/base-path/vite.config.js b/packages/playground/base-path/vite.config.js new file mode 100644 index 00000000000000..6a52ce6ee5be28 --- /dev/null +++ b/packages/playground/base-path/vite.config.js @@ -0,0 +1,24 @@ +const { resolve } = require('path') + +/** + * @type {import('vite').UserConfig} + */ +module.exports = { + base: '/foo/', + build: { + // simulate production environment + outDir: 'dist/foo', + // prevent bundling of dep and preload to ensure that vite-preloading occurs + rollupOptions: { + input: [ + resolve(__dirname, 'index.html'), + resolve(__dirname, 'preload.js'), + resolve(__dirname, 'dep.js') + ], + // use simple entry names for easier reference inside the tests + output: { + entryFileNames: 'assets/[name].js' + } + } + } +} diff --git a/packages/vite/src/node/plugins/importAnalysisBuild.ts b/packages/vite/src/node/plugins/importAnalysisBuild.ts index 16be1f9d760604..39096e75fffd3e 100644 --- a/packages/vite/src/node/plugins/importAnalysisBuild.ts +++ b/packages/vite/src/node/plugins/importAnalysisBuild.ts @@ -242,11 +242,13 @@ export function buildImportAnalysisPlugin(config: ResolvedConfig): Plugin { analyzed.add(filename) const chunk = bundle[filename] as OutputChunk | undefined if (chunk) { - deps.add(config.base + chunk.fileName) + // use a relative path https://github.com/vitejs/vite/pull/3061 + deps.add('./' + chunk.fileName) const cssFiles = chunkToEmittedCssFileMap.get(chunk) if (cssFiles) { cssFiles.forEach((file) => { - deps.add(config.base + file) + // use a relative path https://github.com/vitejs/vite/pull/3061 + deps.add('./' + file) }) } chunk.imports.forEach(addDeps) @@ -267,10 +269,7 @@ export function buildImportAnalysisPlugin(config: ResolvedConfig): Plugin { // the dep list includes the main chunk, so only need to // preload when there are actual other deps. deps.size > 1 - ? `[${[...deps] - // replace leading slashes to ensure a relative path. See https://github.com/vitejs/vite/pull/3061 - .map((d) => JSON.stringify(d.replace(/^\//, './'))) - .join(',')}]` + ? `[${[...deps].map((d) => JSON.stringify(d)).join(',')}]` : `void 0` ) }