michael/astro
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Fix preact compat support for libraries (#4213)

Browse source 
Co-authored-by: Matthew Phillips <matthew@skypack.dev>
This commit is contained in:
Bjorn Lu 2022-08-10 22:22:10 +08:00 committed by GitHub
parent c38e7f1890
commit f8e3853394
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
12 changed files with 171 additions and 32 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
.changeset/tall-eels-wink.md Normal file
View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Bump Vite to 3.0.5

5
.changeset/tall-walls-visit.md Normal file
View file

@ -0,0 +1,5 @@
---
'@astrojs/preact': patch
---
Fix compat support for libraries

2
packages/astro/package.json
View file

@ -138,7 +138,7 @@
"tsconfig-resolver": "^3.0.1", "tsconfig-resolver": "^3.0.1",
"unist-util-visit": "^4.1.0", "unist-util-visit": "^4.1.0",
"vfile": "^5.3.2", "vfile": "^5.3.2",
"vite": "3.0.4", "vite": "3.0.5",
"yargs-parser": "^21.0.1", "yargs-parser": "^21.0.1",
"zod": "^3.17.3" "zod": "^3.17.3"
}, },

7
packages/astro/test/fixtures/preact-compat-component/astro.config.mjs vendored Normal file
View file

@ -0,0 +1,7 @@
import { defineConfig } from 'astro/config';
import preact from '@astrojs/preact';
// https://astro.build/config
export default defineConfig({
integrations: [preact({ compat: true })],
});

11
packages/astro/test/fixtures/preact-compat-component/package.json vendored Normal file
View file

@ -0,0 +1,11 @@
{
"name": "@test/preact-compat-component",
"version": "0.0.0",
"private": true,
"dependencies": {
"@astrojs/preact": "workspace:*",
"@test/react-lib": "workspace:*",
"astro": "workspace:*",
"preact": "^10.10.1"
}
}

5
packages/astro/test/fixtures/preact-compat-component/packages/react-lib/index.js vendored Normal file
View file

@ -0,0 +1,5 @@
import { useState } from "react";
export function useSpecialState(initialState) {
return useState(initialState);
}

9
packages/astro/test/fixtures/preact-compat-component/packages/react-lib/package.json vendored Normal file
View file

@ -0,0 +1,9 @@
{
"name": "@test/react-lib",
"version": "0.0.0",
"private": true,
"type": "module",
"dependencies": {
"react": "^18.2.0"
}
}

19
packages/astro/test/fixtures/preact-compat-component/src/components/Counter.jsx vendored Normal file
View file

@ -0,0 +1,19 @@
/** @jsxImportSource preact */
import { useSpecialState } from '@test/react-lib'
export default function Counter({ children }) {
const [count, setCount] = useSpecialState(0);
const add = () => setCount((i) => i + 1);
const subtract = () => setCount((i) => i - 1);
return (
<>
<div class="counter">
<button onClick={subtract}>-</button>
<pre id="counter-text">{count}</pre>
<button onClick={add}>+</button>
</div>
<div class="counter-message">{children}</div>
</>
);
}

12
packages/astro/test/fixtures/preact-compat-component/src/pages/index.astro vendored Normal file
View file

@ -0,0 +1,12 @@
---
import Counter from '../components/Counter.jsx';
---
<html>
<head>
<title>Preact compat component</title>
</head>
<body>
<Counter client:load />
</body>
</html>

41
packages/astro/test/preact-compat-component.test.js Normal file
View file

@ -0,0 +1,41 @@
import { expect } from 'chai';
import * as cheerio from 'cheerio';
import { loadFixture } from './test-utils.js';
describe('Preact compat component', () => {
describe('Development', () => {
let fixture;
before(async () => {
fixture = await loadFixture({
root: './fixtures/preact-compat-component/',
});
await fixture.startDevServer();
});
it('Can load Counter', async () => {
const html = await fixture.fetch('/').then((res) => res.text());
const $ = cheerio.load(html);
expect($('#counter-text').text()).to.be.eq('0');
});
});
describe('Build', () => {
let fixture;
before(async () => {
fixture = await loadFixture({
root: './fixtures/preact-compat-component/',
});
await fixture.build();
});
it('Can load Counter', async () => {
const html = await fixture.readFile('/index.html');
const $ = cheerio.load(html);
expect($('#counter-text').text()).to.be.eq('0');
});
});
});

9
packages/integrations/preact/src/index.ts
View file

@ -78,8 +78,15 @@ function getViteConfiguration(compat?: boolean): ViteUserConfig {
{ find: 'react-dom', replacement: 'preact/compat' }, { find: 'react-dom', replacement: 'preact/compat' },
{ find: 'react/jsx-runtime', replacement: 'preact/jsx-runtime' }, { find: 'react/jsx-runtime', replacement: 'preact/jsx-runtime' },
], ],
dedupe: ['preact/compat'], dedupe: ['preact/compat', 'preact'],
}; };
// noExternal React entrypoints to be bundled, resolved, and aliased by Vite
viteConfig.ssr!.noExternal = [
'react',
'react-dom',
'react-dom/test-utils',
'react/jsx-runtime',
];
} }
return viteConfig; return viteConfig;

78
pnpm-lock.yaml
View file

@ -460,7 +460,7 @@ importers:
tsconfig-resolver: ^3.0.1 tsconfig-resolver: ^3.0.1
unist-util-visit: ^4.1.0 unist-util-visit: ^4.1.0
vfile: ^5.3.2 vfile: ^5.3.2
vite: 3.0.4 vite: 3.0.5
yargs-parser: ^21.0.1 yargs-parser: ^21.0.1
zod: ^3.17.3 zod: ^3.17.3
dependencies: dependencies:
@ -516,7 +516,7 @@ importers:
tsconfig-resolver: 3.0.1 tsconfig-resolver: 3.0.1
unist-util-visit: 4.1.0 unist-util-visit: 4.1.0
vfile: 5.3.4 vfile: 5.3.4
vite: 3.0.4_sass@1.54.4 vite: 3.0.5_sass@1.54.4
yargs-parser: 21.1.1 yargs-parser: 21.1.1
zod: 3.18.0 zod: 3.18.0
devDependencies: devDependencies:
@ -1666,6 +1666,24 @@ importers:
devDependencies: devDependencies:
postcss-preset-env: 7.7.2_postcss@8.4.16 postcss-preset-env: 7.7.2_postcss@8.4.16
packages/astro/test/fixtures/preact-compat-component:
specifiers:
'@astrojs/preact': workspace:*
'@test/react-lib': workspace:*
astro: workspace:*
preact: ^10.10.1
dependencies:
'@astrojs/preact': link:../../../../integrations/preact
'@test/react-lib': link:packages/react-lib
astro: link:../../..
preact: 10.10.2
packages/astro/test/fixtures/preact-compat-component/packages/react-lib:
specifiers:
react: ^18.2.0
dependencies:
react: 18.2.0
packages/astro/test/fixtures/preact-component: packages/astro/test/fixtures/preact-component:
specifiers: specifiers:
'@astrojs/preact': workspace:* '@astrojs/preact': workspace:*
@ -16580,34 +16598,6 @@ packages:
- supports-color - supports-color
dev: true dev: true
/vite/3.0.4_sass@1.54.4:
resolution: {integrity: sha512-NU304nqnBeOx2MkQnskBQxVsa0pRAH5FphokTGmyy8M3oxbvw7qAXts2GORxs+h/2vKsD+osMhZ7An6yK6F1dA==}
engines: {node: ^14.18.0 || >=16.0.0}
hasBin: true
peerDependencies:
less: '*'
sass: '*'
stylus: '*'
terser: ^5.4.0
peerDependenciesMeta:
less:
optional: true
sass:
optional: true
stylus:
optional: true
terser:
optional: true
dependencies:
esbuild: 0.14.54
postcss: 8.4.16
resolve: 1.22.1
rollup: 2.77.2
sass: 1.54.4
optionalDependencies:
fsevents: 2.3.2
dev: false
/vite/3.0.5: /vite/3.0.5:
resolution: {integrity: sha512-bRvrt9Tw8EGW4jj64aYFTnVg134E8hgDxyl/eEHnxiGqYk7/pTPss6CWlurqPOUzqvEoZkZ58Ws+Iu8MB87iMA==} resolution: {integrity: sha512-bRvrt9Tw8EGW4jj64aYFTnVg134E8hgDxyl/eEHnxiGqYk7/pTPss6CWlurqPOUzqvEoZkZ58Ws+Iu8MB87iMA==}
engines: {node: ^14.18.0 || >=16.0.0} engines: {node: ^14.18.0 || >=16.0.0}
@ -16634,6 +16624,34 @@ packages:
optionalDependencies: optionalDependencies:
fsevents: 2.3.2 fsevents: 2.3.2
/vite/3.0.5_sass@1.54.4:
resolution: {integrity: sha512-bRvrt9Tw8EGW4jj64aYFTnVg134E8hgDxyl/eEHnxiGqYk7/pTPss6CWlurqPOUzqvEoZkZ58Ws+Iu8MB87iMA==}
engines: {node: ^14.18.0 || >=16.0.0}
hasBin: true
peerDependencies:
less: '*'
sass: '*'
stylus: '*'
terser: ^5.4.0
peerDependenciesMeta:
less:
optional: true
sass:
optional: true
stylus:
optional: true
terser:
optional: true
dependencies:
esbuild: 0.14.54
postcss: 8.4.16
resolve: 1.22.1
rollup: 2.77.2
sass: 1.54.4
optionalDependencies:
fsevents: 2.3.2
dev: false
/vitest/0.20.3: /vitest/0.20.3:
resolution: {integrity: sha512-cXMjTbZxBBUUuIF3PUzEGPLJWtIMeURBDXVxckSHpk7xss4JxkiiWh5cnIlfGyfJne2Ii3QpbiRuFL5dMJtljw==} resolution: {integrity: sha512-cXMjTbZxBBUUuIF3PUzEGPLJWtIMeURBDXVxckSHpk7xss4JxkiiWh5cnIlfGyfJne2Ii3QpbiRuFL5dMJtljw==}
engines: {node: '>=v14.16.0'} engines: {node: '>=v14.16.0'}