ElMassimo
Disabling cssCodeSplit breaks CSS file location used by tag helper in Rails
Setting cssCodeSplit (https://vitejs.dev/config/build-options#build-csscodesplit) to false in order to create a single CSS file as per the documentation: "If disabled, all CSS in the entire project will be extracted into a single CSS file." causes Vite to create two files if we have app/javascript/entrypoints/style.scss:
style-P1uBkUvy.css style-w40geAFS.js
The tag helper used to render this stylesheet in the view:
<%= vite_stylesheet_tag 'style.scss', media: 'all', 'data-turbo-track': 'reload' %>
Renders (a non existent file reference, see the .js.css extension):
<link rel="stylesheet" media="all" href="/vite/assets/style-w40geAFS.js.css" data-turbo-track="reload" />
Instead of:
<link rel="stylesheet" media="all" href="/vite/assets/style-P1uBkUvy.css" data-turbo-track="reload" />
Setting cssCodeSplit to true fixes this, but means any CSS imported into JS files will no longer be combined with the main CSS file. Making this setting fragile in the case of this plugin. Is it possible to allow this setting to be able to be set to false without it breaking the tag helper and pointing to the wrong file?
Environment:
bin/vite present?: true
vite_ruby: 3.5.0
vite_rails: 3.0.17
rails: 6.1.7.6
node: v18.13.0
npm: 8.19.3
yarn: 1.22.17
pnpm: 8.10.5
ruby: ruby 3.2.2 (2023-03-30 revision e51014f9c0) [arm64-darwin22]
├─┬ @vitejs/[email protected]
│ └── [email protected] deduped
├─┬ [email protected]
│ └── [email protected] deduped
└── [email protected]
