Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: support css?url to return asset path #11084

Closed
wants to merge 4 commits into from

Conversation

MarvelSQ
Copy link

@MarvelSQ MarvelSQ commented Nov 27, 2022

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
Copy link
Author

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

@MarvelSQ MarvelSQ changed the title Feat/support css?url to return asset path feat: support css?url to return asset path Nov 27, 2022
@MarvelSQ MarvelSQ marked this pull request as ready for review November 27, 2022 07:28
@nd0ut
Copy link

nd0ut commented Feb 2, 2023

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
Copy link
Member

Closing as #15259 is merged.

@sapphi-red sapphi-red closed this Feb 29, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Loading SCSS with the ?url flag causes the import to fail
3 participants