Infrastructure/astro
0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2025-03-10 23:01:26 -05:00
Code Issues Activity

wip

Browse source
This commit is contained in:
Fred K. Schott 2022-07-18 10:29:56 -07:00
parent 963100fb27
commit 4bdd306f8c
7 changed files with 91 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
examples/framework-react/src/components/Counter.jsx
View file

@ -11,6 +11,7 @@ export default function Counter({ children, count: initialCount }) {
<div className="counter">
<button onClick={subtract}>-</button>
<pre>{count}</pre>
Hi
<button onClick={add}>+</button>
</div>
<div className="counter-message">{children}</div>

2
examples/framework-react/src/pages/index.astro
View file

@ -27,7 +27,7 @@ const someProps = {
</head>
<body>
<main>
<Counter {...someProps} client:visible>
<Counter {...someProps} client:load>
<h1>Hello, React!</h1>
</Counter>
</main>

2
packages/astro/src/core/create-vite.ts
View file

@ -71,7 +71,7 @@ export async function createVite(
mode === 'dev' && astroViteServerPlugin({ config: astroConfig, logging }),
envVitePlugin({ config: astroConfig }),
markdownVitePlugin({ config: astroConfig }),
jsxVitePlugin({ config: astroConfig, logging }),
// jsxVitePlugin({ config: astroConfig, logging }),
astroPostprocessVitePlugin({ config: astroConfig }),
astroIntegrationsContainerPlugin({ config: astroConfig }),
],

3
packages/integrations/react/package.json
View file

@ -35,7 +35,8 @@
},
"dependencies": {
"@babel/core": ">=7.0.0-0 <8.0.0",
"@babel/plugin-transform-react-jsx": "^7.17.12"
"@babel/plugin-transform-react-jsx": "^7.17.12",
"@vitejs/plugin-react": "1.3.2"
},
"devDependencies": {
"@types/react": "^17.0.45",

17
packages/integrations/react/src/index.ts
View file

@ -1,7 +1,8 @@
import { AstroIntegration } from 'astro';
import { version as ReactVersion } from 'react-dom';
import react from '@vitejs/plugin-react';
function getRenderer() {
function getRenderer(options: {include: any, exclude: any}) {
return {
name: '@astrojs/react',
clientEntrypoint: ReactVersion.startsWith('18.')
@ -56,6 +57,7 @@ function getViteConfiguration() {
resolve: {
dedupe: ['react', 'react-dom'],
},
plugins: [react()],
ssr: {
external: ReactVersion.startsWith('18.')
? ['react-dom/server', 'react-dom/client']
@ -64,12 +66,19 @@ function getViteConfiguration() {
};
}
export default function (): AstroIntegration {
export default function (options: {include?: any, exclude?: any} = {}): AstroIntegration {
return {
name: '@astrojs/react',
hooks: {
'astro:config:setup': ({ addRenderer, updateConfig }) => {
addRenderer(getRenderer());
'astro:config:setup': ({ addRenderer, updateConfig, injectScript }) => {
injectScript('before-hydration', `
import RefreshRuntime from "/@react-refresh"
RefreshRuntime.injectIntoGlobalHook(window)
window.$RefreshReg$ = () => {}
window.$RefreshSig$ = () => (type) => type
window.__vite_plugin_react_preamble_installed__ = true
`);
addRenderer(getRenderer({include: options.include, exclude: options.exclude}));
updateConfig({ vite: getViteConfiguration() });
},
},

22
packages/webapi/mod.d.ts vendored
View file

@ -1,12 +1,12 @@
export { pathToPosix } from './lib/utils';
export { AbortController, AbortSignal, alert, atob, Blob, btoa, ByteLengthQueuingStrategy, cancelAnimationFrame, cancelIdleCallback, CanvasRenderingContext2D, CharacterData, clearTimeout, Comment, CountQueuingStrategy, CSSStyleSheet, CustomElementRegistry, CustomEvent, Document, DocumentFragment, DOMException, Element, Event, EventTarget, fetch, File, FormData, Headers, HTMLBodyElement, HTMLCanvasElement, HTMLDivElement, HTMLDocument, HTMLElement, HTMLHeadElement, HTMLHtmlElement, HTMLImageElement, HTMLSpanElement, HTMLStyleElement, HTMLTemplateElement, HTMLUnknownElement, Image, ImageData, IntersectionObserver, MediaQueryList, MutationObserver, Node, NodeFilter, NodeIterator, OffscreenCanvas, ReadableByteStreamController, ReadableStream, ReadableStreamBYOBReader, ReadableStreamBYOBRequest, ReadableStreamDefaultController, ReadableStreamDefaultReader, Request, requestAnimationFrame, requestIdleCallback, ResizeObserver, Response, setTimeout, ShadowRoot, structuredClone, StyleSheet, Text, TransformStream, TreeWalker, URLPattern, Window, WritableStream, WritableStreamDefaultController, WritableStreamDefaultWriter } from './mod.js';
export declare const polyfill: {
(target: any, options?: PolyfillOptions): any;
internals(target: any, name: string): any;
};
interface PolyfillOptions {
exclude?: string | string[];
override?: Record<string, {
(...args: any[]): any;
}>;
}
export { AbortController, AbortSignal, alert, atob, Blob, btoa, ByteLengthQueuingStrategy, cancelAnimationFrame, cancelIdleCallback, CanvasRenderingContext2D, CharacterData, clearTimeout, Comment, CountQueuingStrategy, CSSStyleSheet, CustomElementRegistry, CustomEvent, Document, DocumentFragment, DOMException, Element, Event, EventTarget, fetch, File, FormData, Headers, HTMLBodyElement, HTMLCanvasElement, HTMLDivElement, HTMLDocument, HTMLElement, HTMLHeadElement, HTMLHtmlElement, HTMLImageElement, HTMLSpanElement, HTMLStyleElement, HTMLTemplateElement, HTMLUnknownElement, Image, ImageData, IntersectionObserver, MediaQueryList, MutationObserver, Node, NodeFilter, NodeIterator, OffscreenCanvas, ReadableByteStreamController, ReadableStream, ReadableStreamBYOBReader, ReadableStreamBYOBRequest, ReadableStreamDefaultController, ReadableStreamDefaultReader, Request, requestAnimationFrame, requestIdleCallback, ResizeObserver, Response, setTimeout, ShadowRoot, structuredClone, StyleSheet, Text, TransformStream, TreeWalker, URLPattern, Window, WritableStream, WritableStreamDefaultController, WritableStreamDefaultWriter, } from './mod.js';
export declare const polyfill: {
(target: any, options?: PolyfillOptions): any;
internals(target: any, name: string): any;
};
interface PolyfillOptions {
exclude?: string | string[];
override?: Record<string, {
(...args: any[]): any;
}>;
}

62
pnpm-lock.yaml generated
View file

@ -2129,6 +2129,7 @@ importers:
'@babel/plugin-transform-react-jsx': ^7.17.12
'@types/react': ^17.0.45
'@types/react-dom': ^17.0.17
'@vitejs/plugin-react': 1.3.2
astro: workspace:*
astro-scripts: workspace:*
react: ^18.1.0
@ -2136,6 +2137,7 @@ importers:
dependencies:
'@babel/core': 7.18.6
'@babel/plugin-transform-react-jsx': 7.18.6_@babel+core@7.18.6
'@vitejs/plugin-react': 1.3.2
devDependencies:
'@types/react': 17.0.47
'@types/react-dom': 17.0.17
@ -3783,6 +3785,45 @@ packages:
'@babel/helper-plugin-utils': 7.18.6
dev: true
/@babel/plugin-transform-react-jsx-development/7.18.6_@babel+core@7.18.6:
resolution: {integrity: sha512-SA6HEjwYFKF7WDjWcMcMGUimmw/nhNRDWxr+KaLSCrkD/LMDBvWRmHAYgE1HDeF8KUuI8OAu+RT6EOtKxSW2qA==}
engines: {node: '>=6.9.0'}
peerDependencies:
'@babel/core': ^7.0.0-0
peerDependenciesMeta:
'@babel/core':
optional: true
dependencies:
'@babel/core': 7.18.6
'@babel/plugin-transform-react-jsx': 7.18.6_@babel+core@7.18.6
dev: false
/@babel/plugin-transform-react-jsx-self/7.18.6_@babel+core@7.18.6:
resolution: {integrity: sha512-A0LQGx4+4Jv7u/tWzoJF7alZwnBDQd6cGLh9P+Ttk4dpiL+J5p7NSNv/9tlEFFJDq3kjxOavWmbm6t0Gk+A3Ig==}
engines: {node: '>=6.9.0'}
peerDependencies:
'@babel/core': ^7.0.0-0
peerDependenciesMeta:
'@babel/core':
optional: true
dependencies:
'@babel/core': 7.18.6
'@babel/helper-plugin-utils': 7.18.6
dev: false
/@babel/plugin-transform-react-jsx-source/7.18.6_@babel+core@7.18.6:
resolution: {integrity: sha512-utZmlASneDfdaMh0m/WausbjUjEdGrQJz0vFK93d7wD3xf5wBtX219+q6IlCNZeguIcxS2f/CvLZrlLSvSHQXw==}
engines: {node: '>=6.9.0'}
peerDependencies:
'@babel/core': ^7.0.0-0
peerDependenciesMeta:
'@babel/core':
optional: true
dependencies:
'@babel/core': 7.18.6
'@babel/helper-plugin-utils': 7.18.6
dev: false
/@babel/plugin-transform-react-jsx/7.18.6_@babel+core@7.18.6:
resolution: {integrity: sha512-Mz7xMPxoy9kPS/JScj6fJs03TZ/fZ1dJPlMjRAgTaxaS0fUBk8FV/A2rRgfPsVCZqALNwMexD+0Uaf5zlcKPpw==}
engines: {node: '>=6.9.0'}
@ -7862,6 +7903,22 @@ packages:
- supports-color
dev: false
/@vitejs/plugin-react/1.3.2:
resolution: {integrity: sha512-aurBNmMo0kz1O4qRoY+FM4epSA39y3ShWGuqfLRA/3z0oEJAdtoSfgA3aO98/PCCHAqMaduLxIxErWrVKIFzXA==}
engines: {node: '>=12.0.0'}
dependencies:
'@babel/core': 7.18.6
'@babel/plugin-transform-react-jsx': 7.18.6_@babel+core@7.18.6
'@babel/plugin-transform-react-jsx-development': 7.18.6_@babel+core@7.18.6
'@babel/plugin-transform-react-jsx-self': 7.18.6_@babel+core@7.18.6
'@babel/plugin-transform-react-jsx-source': 7.18.6_@babel+core@7.18.6
'@rollup/pluginutils': 4.2.1
react-refresh: 0.13.0
resolve: 1.22.1
transitivePeerDependencies:
- supports-color
dev: false
/@vitejs/plugin-vue/2.3.3_vite@2.9.14+vue@3.2.37:
resolution: {integrity: sha512-SmQLDyhz+6lGJhPELsBdzXGc+AcaT8stgkbiTFGpXPe8Tl1tJaBw1A6pxDqDuRsVkD8uscrkx3hA7QDOoKYtyw==}
engines: {node: '>=12.0.0'}
@ -13133,6 +13190,11 @@ packages:
resolution: {integrity: sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==}
dev: false
/react-refresh/0.13.0:
resolution: {integrity: sha512-XP8A9BT0CpRBD+NYLLeIhld/RqG9+gktUjW1FkE+Vm7OCinbG1SshcK5tb9ls4kzvjZr9mOQc7HYgBngEyPAXg==}
engines: {node: '>=0.10.0'}
dev: false
/react-transition-group/2.9.0_biqbaboplfbrettd7655fr4n2y:
resolution: {integrity: sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg==}
peerDependencies: