Fix support for ?url on CSS (#2106)
* Fix support for ?url on CSS * Adds a changeset * chore(lint): Prettier fix Co-authored-by: GitHub Action <github-action@users.noreply.github.com>
This commit is contained in:
parent
4c44467668
commit
583459d0b6
5 changed files with 19 additions and 2 deletions
5
.changeset/gold-windows-sell.md
Normal file
5
.changeset/gold-windows-sell.md
Normal file
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Fix for using ?url with CSS imports
|
|
@ -277,6 +277,11 @@ describe('CSS', function () {
|
|||
expect((await fixture.fetch(href)).status).to.equal(200);
|
||||
});
|
||||
|
||||
it('resolved imported CSS with ?url', async () => {
|
||||
const href = $('link[href$="imported-url.css"]').attr('href');
|
||||
expect((await fixture.fetch(href)).status).to.equal(200);
|
||||
});
|
||||
|
||||
it('resolves Astro styles', async () => {
|
||||
const style = $('style[astro-style]');
|
||||
expect(style.length).to.not.equal(0);
|
||||
|
|
|
@ -18,6 +18,8 @@ import VueSass from '../components/VueSass.vue';
|
|||
import VueScoped from '../components/VueScoped.vue';
|
||||
import VueScss from '../components/VueScss.vue';
|
||||
import ReactDynamic from '../components/ReactDynamic.jsx';
|
||||
|
||||
import importedUrl from '../styles/imported-url.css?url';
|
||||
---
|
||||
|
||||
<html>
|
||||
|
@ -37,6 +39,7 @@ import ReactDynamic from '../components/ReactDynamic.jsx';
|
|||
<link rel="stylesheet" type="text/css" href={Astro.resolve('../styles/linked.css')}>
|
||||
<link rel="stylesheet" type="text/css" href={Astro.resolve('../styles/linked.scss')}>
|
||||
<link rel="stylesheet" type="text/css" href={Astro.resolve('../styles/linked.sass')}>
|
||||
<link rel="stylesheet" type="text/css" href={importedUrl}>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
|
|
3
packages/astro/test/fixtures/0-css/src/styles/imported-url.css
vendored
Normal file
3
packages/astro/test/fixtures/0-css/src/styles/imported-url.css
vendored
Normal file
|
@ -0,0 +1,3 @@
|
|||
.imported {
|
||||
color: gold;
|
||||
}
|
|
@ -5771,6 +5771,7 @@ const assetUrlRE = /__VITE_ASSET__([a-z\d]{8})__(?:\$_(.*?)__)?/g;
|
|||
const assetUrlQuotedRE = /"__VITE_ASSET__([a-z\d]{8})__(?:\$_(.*?)__)?"/g;
|
||||
const rawRE = /(\?|&)raw(?:&|$)/;
|
||||
const urlRE = /(\?|&)url(?:&|$)/;
|
||||
const isURLRequest = (id) => urlRE.test(id)
|
||||
const chunkToEmittedAssetsMap = new WeakMap();
|
||||
const assetCache = new WeakMap();
|
||||
const assetHashToFilenameMap = new WeakMap();
|
||||
|
@ -19848,7 +19849,7 @@ function cssPlugin(config) {
|
|||
removedPureCssFilesCache.set(config, new Map());
|
||||
},
|
||||
async transform(raw, id) {
|
||||
if (!isCSSRequest(id) || commonjsProxyRE.test(id)) {
|
||||
if (!isCSSRequest(id) || commonjsProxyRE.test(id) || isURLRequest(id)) {
|
||||
return;
|
||||
}
|
||||
const urlReplacer = async (url, importer) => {
|
||||
|
@ -19929,7 +19930,7 @@ function cssPostPlugin(config) {
|
|||
hasEmitted = false;
|
||||
},
|
||||
async transform(css, id, ssr) {
|
||||
if (!isCSSRequest(id) || commonjsProxyRE.test(id)) {
|
||||
if (!isCSSRequest(id) || commonjsProxyRE.test(id) || isURLRequest(id)) {
|
||||
return;
|
||||
}
|
||||
const inlined = inlineRE.test(id);
|
||||
|
|
Loading…
Reference in a new issue