Correctly transform third-party JSX files (#5437)

This commit is contained in:
Bjorn Lu 2022-11-19 00:36:09 +08:00 committed by GitHub
parent a334f1212e
commit 4b188132ef
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 65 additions and 0 deletions

View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Correctly transform third-party JSX files

View file

@ -59,3 +59,8 @@ export function removeFileExtension(path: string) {
let idx = path.lastIndexOf('.');
return idx === -1 ? path : path.slice(0, idx);
}
export function removeQueryString(path: string) {
const index = path.lastIndexOf('?');
return index > 0 ? path.substring(0, index) : path;
}

View file

@ -11,6 +11,7 @@ import esbuild from 'esbuild';
import * as colors from 'kleur/colors';
import path from 'path';
import { error } from '../core/logger/core.js';
import { removeQueryString } from '../core/path.js';
import { parseNpmName } from '../core/util.js';
import tagExportsPlugin from './tag.js';
@ -187,6 +188,7 @@ export default function jsx({ settings, logging }: AstroPluginJSXOptions): Plugi
},
async transform(code, id, opts) {
const ssr = Boolean(opts?.ssr);
id = removeQueryString(id);
if (!JSX_EXTENSIONS.has(path.extname(id))) {
return null;
}

View file

@ -0,0 +1,18 @@
import { createSignal } from 'solid-js';
export default function Counter(props) {
const [count, setCount] = createSignal(0);
const add = () => setCount(count() + 1);
const subtract = () => setCount(count() - 1);
return (
<>
<div class="counter">
<button onClick={subtract}>-</button>
<pre>{count()}</pre>
<button onClick={add}>+</button>
</div>
<div class="counter-message">{props.children}</div>
</>
);
}

View file

@ -0,0 +1 @@
export { default as Counter } from './Counter'

View file

@ -0,0 +1,15 @@
{
"name": "@test/solid-jsx-component",
"version": "0.0.0",
"private": true,
"type": "module",
"exports": {
".": {
"solid": "./index.js",
"default": "./index.js"
}
},
"dependencies": {
"solid-js": "^1.5.6"
}
}

View file

@ -5,6 +5,7 @@
"dependencies": {
"@astrojs/solid-js": "workspace:*",
"@solidjs/router": "^0.5.0",
"@test/solid-jsx-component": "file:./deps/solid-jsx-component",
"astro": "workspace:*",
"solid-js": "^1.5.6"
}

View file

@ -3,6 +3,7 @@ import Hello from '../components/Hello.jsx';
import WithNewlines from '../components/WithNewlines.jsx';
import { Router } from "@solidjs/router";
import ProxyComponent from '../components/ProxyComponent.jsx';
import { Counter as DepCounter } from '@test/solid-jsx-component';
---
<html>
<head><title>Solid</title></head>
@ -12,6 +13,7 @@ import ProxyComponent from '../components/ProxyComponent.jsx';
<WithNewlines client:load />
<Router />
<ProxyComponent client:load />
<DepCounter client:load />
</div>
</body>
</html>

View file

@ -2178,14 +2178,22 @@ importers:
specifiers:
'@astrojs/solid-js': workspace:*
'@solidjs/router': ^0.5.0
'@test/solid-jsx-component': file:./deps/solid-jsx-component
astro: workspace:*
solid-js: ^1.5.6
dependencies:
'@astrojs/solid-js': link:../../../../integrations/solid
'@solidjs/router': 0.5.0_solid-js@1.6.2
'@test/solid-jsx-component': file:packages/astro/test/fixtures/solid-component/deps/solid-jsx-component
astro: link:../../..
solid-js: 1.6.2
packages/astro/test/fixtures/solid-component/deps/solid-jsx-component:
specifiers:
solid-js: ^1.5.6
dependencies:
solid-js: 1.6.2
packages/astro/test/fixtures/sourcemap:
specifiers:
'@astrojs/react': workspace:*
@ -18821,3 +18829,11 @@ packages:
name: '@astrojs/renderer-two'
version: 1.0.0
dev: false
file:packages/astro/test/fixtures/solid-component/deps/solid-jsx-component:
resolution: {directory: packages/astro/test/fixtures/solid-component/deps/solid-jsx-component, type: directory}
name: '@test/solid-jsx-component'
version: 0.0.0
dependencies:
solid-js: 1.6.2
dev: false