From 17ca01d1dbaad82b433f5b5479102366dd425b78 Mon Sep 17 00:00:00 2001 From: bluwy Date: Tue, 29 Mar 2022 13:42:55 +0800 Subject: [PATCH] docs: note url string must be static --- docs/guide/assets.md | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/docs/guide/assets.md b/docs/guide/assets.md index fd5aa46f49467f..53ac153f9465bd 100644 --- a/docs/guide/assets.md +++ b/docs/guide/assets.md @@ -103,8 +103,13 @@ function getImageUrl(name) { } ``` -During the production build, Vite will perform necessary transforms so that the URLs still point to the correct location even after bundling and asset hashing. +During the production build, Vite will perform necessary transforms so that the URLs still point to the correct location even after bundling and asset hashing. However, the URL string must be static so it can be analyzed, otherwise the code will be left as is, which can cause runtime errors if `build.target` does not support `import.meta.url` -::: warning Note: Does not work with SSR +```js +// Vite will not transform this +const imgUrl = new URL(imagePath, import.meta.url).href +``` + +::: warning Does not work with SSR This pattern does not work if you are using Vite for Server-Side Rendering, because `import.meta.url` have different semantics in browsers vs. Node.js. The server bundle also cannot determine the client host URL ahead of time. :::