Infrastructure/astro
0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-16 21:46:22 -05:00
Code Issues Activity

Use Vite's resolve to resolve paths for client:only (#5434)

Browse source 
* Use Vite's resolve to resolve paths for client:only

* Adding a changeset

* Add it to the markdown legacy plugin too

* Remove fully resolving

* Fully resolve in the analyzer

* don't do this twice

* remove dead code
This commit is contained in:
Matthew Phillips 2022-11-18 10:44:55 -05:00 committed by GitHub
parent 4266869f4f
commit f5ed630bca
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 37 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/pink-cheetahs-heal.md Normal file
View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Use Vite's resolve to resolve paths for client:only

11
packages/astro/src/core/build/vite-plugin-analyzer.ts
View file

@ -95,13 +95,10 @@ export function vitePluginAnalyzer(internals: BuildInternals): VitePlugin {
const cid = c.resolvedPath ? decodeURI(c.resolvedPath) : c.specifier;
internals.discoveredClientOnlyComponents.add(cid);
clientOnlys.push(cid);
// Bare module specifiers need to be resolved so that the CSS
// plugin can walk up the graph to find which page they belong to.
if (c.resolvedPath === c.specifier) {
const resolvedId = await this.resolve(c.specifier, id);
if (resolvedId) {
clientOnlys.push(resolvedId.id);
}
const resolvedId = await this.resolve(c.specifier, id);
if (resolvedId) {
clientOnlys.push(resolvedId.id);
}
}

10
packages/astro/test/astro-client-only.test.js
View file

@ -93,4 +93,14 @@ describe('Client only components subpath', () => {
expect(css).to.match(/yellowgreen/, 'Svelte styles are added');
expect(css).to.match(/Courier New/, 'Global styles are added');
});
it('Adds the CSS to the page for TSX components', async () => {
const html = await fixture.readFile('/tsx-no-extension/index.html');
const $ = cheerioLoad(html);
const href = $('link[rel=stylesheet]').attr('href');
const css = await fixture.readFile(href.replace(/\/blog/, ''));
expect(css).to.match(/purple/, 'Global styles from tsx component are added');
});
});

6
packages/astro/test/fixtures/astro-client-only/src/components/TSXComponent.tsx vendored Normal file
View file

@ -0,0 +1,6 @@
import React from 'react';
import './global2.css';
export default function() {
return <div>i am react</div>
}

3
packages/astro/test/fixtures/astro-client-only/src/components/global2.css vendored Normal file
View file

@ -0,0 +1,3 @@
body {
color: purple;
}

9
packages/astro/test/fixtures/astro-client-only/src/pages/tsx-no-extension.astro vendored Normal file
View file

@ -0,0 +1,9 @@
---
import ReactTSXComponent from '../components/TSXComponent';
---
<html>
<head><title>Client only pages</title></head>
<body>
<ReactTSXComponent client:only="react" />
</body>
</html>