vite
vite copied to clipboard
feat: support css?url to return asset path
Description
vite
support Importing Asset as URL
while using CSS or Less file, works fine in dev
mode, but in build
, it returns a useless dataurl which means nothing for production
import cssPath from './index.css'
/**
* in dev mode "/src/index.css"
* in build mode "data:text/css...."
*/
console.log(cssPath);
in this PR, I changed the original process, replace vite:asset
with vite:css
. using emitFile
to create a new chunk for target CSS file.
import cssPath from './index.css?url'
// "/asset/index.xxx.css"
console.log(cssPath);
Additional context
should fix #2522
What is the purpose of this pull request?
- [ ] Bug fix
- [x] New Feature
- [ ] Documentation update
- [ ] Other
Before submitting the PR, please make sure you do the following
- [ ] Read the Contributing Guidelines.
- [ ] Read the Pull Request Guidelines and follow the Commit Convention.
- [ ] Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
- [x] Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g.
fixes #123
). - [ ] Ideally, include relevant tests that fail without this PR but pass with it.
for this PR, I still have some questions.
- this feature works with
build.cssCodeSplit = true
. should it ignore the config to generate a new chunk or return all asset URLs asstyle.css
- a middleware module for CSS asset path created during the process. in dynamic load it generates an async chunk js, I still wonder should remove this file
This is great! I've been waiting for this feature - it's exactly what I need. It's frustrating that there is a difference between production and development behavior, but this pull request should help resolve that. Thanks!
Closing as #15259 is merged.