From 7048356e4642bb42e5b06b8cde47c9a34f9ad053 Mon Sep 17 00:00:00 2001 From: Helmut Hummel Date: Mon, 27 Nov 2023 18:30:47 +0100 Subject: [PATCH 1/4] Reflect changes to manifest.json in migration.md Related: #14945 Fixes: #15161 --- docs/guide/migration.md | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/docs/guide/migration.md b/docs/guide/migration.md index 7b79a9b139077c..6d734a41d1a70e 100644 --- a/docs/guide/migration.md +++ b/docs/guide/migration.md @@ -134,6 +134,14 @@ In Vite 4, the manifest files ([`build.manifest`](/config/build-options.md#build From Vite 5, they will be generated in the `.vite` directory in the `build.outDir` by default. This change helps deconflict public files with the same manifest file names when they are copied to the `build.outDir`. +### Corresponding CSS files are not listed as top level entry in manifest.json file + +In Vite 4, the corresponding CSS file for a JavaScript entry point was also listed as top level entry in the manifest.json file. + +In Vite 5, corresponding CSS files can only be found within the JavaScript entry file section. +When injecting the JS file, the corresponding CSS files [should be injected](https://vitejs.dev/guide/backend-integration.html#:~:text=%3C!%2D%2D%20if%20production%20%2D%2D%3E%0A%3Clink%20rel%3D%22stylesheet%22%20href%3D%22/assets/%7B%7B%20manifest%5B%27main.js%27%5D.css%20%7D%7D%22%20/%3E%0A%3Cscript%20type%3D%22module%22%20src%3D%22/assets/%7B%7B%20manifest%5B%27main.js%27%5D.file%20%7D%7D%22%3E%3C/script%3E). +When the CSS should be injected separately, it must be added as separate entry point. + ### CLI shortcuts require an additional `Enter` press CLI shortcuts, like `r` to restart the dev server, now require an additional `Enter` press to trigger the shortcut. For example, `r + Enter` to restart the dev server. From bcce4dbd8e9a0afe6d081c6749a90ff82eb83e7c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BF=A0=20/=20green?= Date: Tue, 28 Nov 2023 20:48:57 +0900 Subject: [PATCH 2/4] docs: tweak --- docs/guide/migration.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/guide/migration.md b/docs/guide/migration.md index 6d734a41d1a70e..86ea642b31f0b4 100644 --- a/docs/guide/migration.md +++ b/docs/guide/migration.md @@ -136,10 +136,10 @@ From Vite 5, they will be generated in the `.vite` directory in the `build.outDi ### Corresponding CSS files are not listed as top level entry in manifest.json file -In Vite 4, the corresponding CSS file for a JavaScript entry point was also listed as top level entry in the manifest.json file. +In Vite 4, the corresponding CSS file for a JavaScript entry point was also listed as top level entry in the manifest file ([`build.manifest`](/config/build-options.md#build-manifest)). These entries was unintentionally added and only works for simple cases. In Vite 5, corresponding CSS files can only be found within the JavaScript entry file section. -When injecting the JS file, the corresponding CSS files [should be injected](https://vitejs.dev/guide/backend-integration.html#:~:text=%3C!%2D%2D%20if%20production%20%2D%2D%3E%0A%3Clink%20rel%3D%22stylesheet%22%20href%3D%22/assets/%7B%7B%20manifest%5B%27main.js%27%5D.css%20%7D%7D%22%20/%3E%0A%3Cscript%20type%3D%22module%22%20src%3D%22/assets/%7B%7B%20manifest%5B%27main.js%27%5D.file%20%7D%7D%22%3E%3C/script%3E). +When injecting the JS file, the corresponding CSS files [should be injected](/guide/backend-integration.md#:~:text=%3C!%2D%2D%20if%20production%20%2D%2D%3E%0A%3Clink%20rel%3D%22stylesheet%22%20href%3D%22/assets/%7B%7B%20manifest%5B%27main.js%27%5D.css%20%7D%7D%22%20/%3E%0A%3Cscript%20type%3D%22module%22%20src%3D%22/assets/%7B%7B%20manifest%5B%27main.js%27%5D.file%20%7D%7D%22%3E%3C/script%3E). When the CSS should be injected separately, it must be added as separate entry point. ### CLI shortcuts require an additional `Enter` press From 40b3680e325453272d19d05b414283267e9d376b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BF=A0=20/=20green?= Date: Tue, 28 Nov 2023 20:52:09 +0900 Subject: [PATCH 3/4] docs: add #14945 to advanced section --- docs/guide/migration.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/docs/guide/migration.md b/docs/guide/migration.md index 86ea642b31f0b4..0e3672b0ce1946 100644 --- a/docs/guide/migration.md +++ b/docs/guide/migration.md @@ -238,6 +238,8 @@ Also there are other breaking changes which only affect few users. - `resolve.browserField` has been deprecated since Vite 3 in favour of an updated default of `['browser', 'module', 'jsnext:main', 'jsnext']` for [`resolve.mainFields`](/config/shared-options.md#resolve-mainfields). - [[#14855] feat!: add isPreview to ConfigEnv and resolveConfig](https://github.com/vitejs/vite/pull/14855) - Renamed `ssrBuild` to `isSsrBuild` in the `ConfigEnv` object. +- [[#14945] fix(css): correctly set manifest source name and emit CSS file](https://github.com/vitejs/vite/pull/14945) + - CSS file names are now generated based on the chunk name. ## Migration from v3 From 6d989ad3f0c09c8e531e0067020f705a48d57344 Mon Sep 17 00:00:00 2001 From: patak Date: Tue, 28 Nov 2023 13:00:51 +0100 Subject: [PATCH 4/4] chore: update wording --- docs/guide/migration.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/guide/migration.md b/docs/guide/migration.md index 0e3672b0ce1946..5137ee6fb7e760 100644 --- a/docs/guide/migration.md +++ b/docs/guide/migration.md @@ -136,11 +136,11 @@ From Vite 5, they will be generated in the `.vite` directory in the `build.outDi ### Corresponding CSS files are not listed as top level entry in manifest.json file -In Vite 4, the corresponding CSS file for a JavaScript entry point was also listed as top level entry in the manifest file ([`build.manifest`](/config/build-options.md#build-manifest)). These entries was unintentionally added and only works for simple cases. +In Vite 4, the corresponding CSS file for a JavaScript entry point was also listed as a top-level entry in the manifest file ([`build.manifest`](/config/build-options.md#build-manifest)). These entries were unintentionally added and only worked for simple cases. In Vite 5, corresponding CSS files can only be found within the JavaScript entry file section. When injecting the JS file, the corresponding CSS files [should be injected](/guide/backend-integration.md#:~:text=%3C!%2D%2D%20if%20production%20%2D%2D%3E%0A%3Clink%20rel%3D%22stylesheet%22%20href%3D%22/assets/%7B%7B%20manifest%5B%27main.js%27%5D.css%20%7D%7D%22%20/%3E%0A%3Cscript%20type%3D%22module%22%20src%3D%22/assets/%7B%7B%20manifest%5B%27main.js%27%5D.file%20%7D%7D%22%3E%3C/script%3E). -When the CSS should be injected separately, it must be added as separate entry point. +When the CSS should be injected separately, it must be added as a separate entry point. ### CLI shortcuts require an additional `Enter` press