[MarvelSQ]

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
• 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.
• 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.

[MarvelSQ]

for this PR, I still have some questions.

1. this feature works with build.cssCodeSplit = true. should it ignore the config to generate a new chunk or return all asset URLs as style.css
2. 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

[nd0ut]

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!

[sapphi-red]

Closing as #15259 is merged.