Fix mixed usage of aliases and relative for client hydration (#6168)

* Fix mixed usgae of aliases and relative for client hydration

* Add a changeset
This commit is contained in:
Matthew Phillips 2023-02-07 16:24:05 -05:00 committed by GitHub
parent 92dcf81c17
commit c0e4b1df9f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 51 additions and 4 deletions

View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Fix mixed usage of aliases and relative for client hydration

View file

@ -34,12 +34,16 @@ export function vitePluginInternals(input: Set<string>, internals: BuildInternal
async generateBundle(_options, bundle) {
const promises = [];
const mapping = new Map<string, string>();
const mapping = new Map<string, Set<string>>();
for (const specifier of input) {
promises.push(
this.resolve(specifier).then((result) => {
if (result) {
mapping.set(result.id, specifier);
if(mapping.has(result.id)) {
mapping.get(result.id)!.add(specifier);
} else {
mapping.set(result.id, new Set<string>([specifier]));
}
}
})
);
@ -47,8 +51,10 @@ export function vitePluginInternals(input: Set<string>, internals: BuildInternal
await Promise.all(promises);
for (const [, chunk] of Object.entries(bundle)) {
if (chunk.type === 'chunk' && chunk.facadeModuleId) {
const specifier = mapping.get(chunk.facadeModuleId) || chunk.facadeModuleId;
internals.entrySpecifierToBundleMap.set(specifier, chunk.fileName);
const specifiers = mapping.get(chunk.facadeModuleId) || new Set([chunk.facadeModuleId]);
for(const specifier of specifiers) {
internals.entrySpecifierToBundleMap.set(specifier, chunk.fileName);
}
} else if (chunk.type === 'chunk') {
for (const id of Object.keys(chunk.modules)) {
const pageData = internals.pagesByViteID.get(id);

View file

@ -51,5 +51,16 @@ describe('Aliases', () => {
const scripts = $('script').toArray();
expect(scripts.length).to.be.greaterThan(0);
});
it('can use aliases and relative in same project', async () => {
const html = await fixture.readFile('/two/index.html');
const $ = cheerio.load(html);
// Should render aliased element
expect($('#client').text()).to.equal('test');
const scripts = $('script').toArray();
expect(scripts.length).to.be.greaterThan(0);
});
});
});

View file

@ -0,0 +1,25 @@
---
import Client from '../components/Client.svelte'
---
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>Svelte Client</title>
<style>
html,
body {
font-family: system-ui;
margin: 0;
}
body {
padding: 2rem;
}
</style>
</head>
<body>
<main>
<Client client:load />
</main>
</body>
</html>