You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
My Vue site's code, in main.js, imports Bootstrap's CSS like this:
import 'bootstrap/dist/css/bootstrap.min.css';
When I load a page on the site, Vite gives me the message:
Sourcemap for "C:/Development/SPA/myApp/node_modules/bootstrap/dist/css/bootstrap.min.css" points to missing source files
React's default Webpack config doesn't seem to have the same problem when I import the Bootstrap minified CSS in the same way. I think it's because the Bootstrap bootstrap.min.css.map file, amongst its various source mappings, includes "dist/css/bootstrap.css". This is apparently supposed to be interpreted relative to the node_modules/bootstrap root, but Vite interprets it relative to bootstrap.min.css, and so it looks for bootstrap/dist/css/dist/css/bootstrap.css and doesn't find it, causing the error.
Reproduction
Configure Vite to include CSS sourcemaps, add Bootstrap to project, import it in Vue file
Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
@sapphi-red I don't think that's the same problem, actually. That seems to be the browser trying to retrieve the sourcemap, whereas here it's Vite trying to inline the sourcemap and failing on one of the files.
Describe the bug
I have Vite configured to include CSS source maps in dev:
My Vue site's code, in
main.js
, imports Bootstrap's CSS like this:When I load a page on the site, Vite gives me the message:
React's default Webpack config doesn't seem to have the same problem when I import the Bootstrap minified CSS in the same way. I think it's because the Bootstrap
bootstrap.min.css.map
file, amongst its various source mappings, includes"dist/css/bootstrap.css"
. This is apparently supposed to be interpreted relative to thenode_modules/bootstrap
root, but Vite interprets it relative tobootstrap.min.css
, and so it looks forbootstrap/dist/css/dist/css/bootstrap.css
and doesn't find it, causing the error.Reproduction
Configure Vite to include CSS sourcemaps, add Bootstrap to project, import it in Vue file
System Info
Used Package Manager
npm
Logs
No response
Validations
The text was updated successfully, but these errors were encountered: