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

Use import specifier rather than filename (#71)

Browse source
This commit is contained in:
Drew Powers 2021-04-09 14:23:25 -06:00 committed by GitHub
parent 62924b3162
commit e3ca67d6dc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 33 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/compiler/codegen.ts
View file

@ -368,7 +368,10 @@ function compileModule(module: Script, state: CodegenState, compileOptions: Comp
for (const componentImport of componentImports) {
const importUrl = componentImport.source.value;
const componentType = path.posix.extname(importUrl);
const componentName = path.posix.basename(importUrl, componentType);
const specifier = componentImport.specifiers[0];
if (!specifier) continue; // this is unused
// set componentName to default import if used (user), or use filename if no default import (mostly internal use)
const componentName = specifier.type === 'ImportDefaultSpecifier' ? specifier.local.name : path.posix.basename(importUrl, componentType);
const plugin = extensions[componentType] || defaultExtensions[componentType];
state.components[componentName] = {
type: componentType,

11
test/fixtures/react-component/astro/components/Goodbye.vue vendored Normal file
View file

@ -0,0 +1,11 @@
<template>
<h2 id="vue-h2">Hasta la vista, {{ name }}</h2>
</template>
<script>
export default {
props: {
name: String,
},
};
</script>

6
test/fixtures/react-component/astro/components/Hello.jsx vendored
View file

@ -1,5 +1,5 @@
import React from 'react';
export default function({ name }) {
return <h2>Hello {name}!</h2>
}
export default function ({ name }) {
return <h2 id="react-h2">Hello {name}!</h2>;
}

6
test/fixtures/react-component/astro/pages/index.astro vendored
View file

@ -1,5 +1,6 @@
---
import Hello from '../components/Hello.jsx';
import Hello from '../components/Hello.jsx';
import Later from '../components/Goodbye.vue'; // use different specifier
---
<html>
@ -8,5 +9,6 @@
</head>
<body>
<Hello name="world" />
<Later name="baby" />
</body>
</html>
</html>

13
test/react-component.test.js
View file

@ -32,13 +32,22 @@ React('No error creating the runtime', () => {
assert.equal(setupError, undefined);
});
React('Can load page', async () => {
React('Can load React', async () => {
const result = await runtime.load('/');
assert.equal(result.statusCode, 200);
const $ = doc(result.contents);
assert.equal($('h2').text(), 'Hello world!');
assert.equal($('#react-h2').text(), 'Hello world!');
});
React('Can load Vue', async () => {
const result = await runtime.load('/');
assert.equal(result.statusCode, 200);
const $ = doc(result.contents);
assert.equal($('#vue-h2').text(), 'Hasta la vista, baby');
});
React.run();