grab 0.0.81 → 0.0.82
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +52 -0
- package/dist/{chunk-YE5UYZQC.js → chunk-STRAHFDU.js} +2 -2
- package/dist/{chunk-HUGHVCPX.cjs → chunk-VX5TI23F.cjs} +2 -2
- package/dist/cli.cjs +118 -118
- package/dist/core.cjs +1 -1
- package/dist/core.js +1 -1
- package/dist/index.cjs +2 -2
- package/dist/index.global.js +2 -2
- package/dist/index.js +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -384,6 +384,58 @@ export default function RootLayout({ children }) {
|
|
|
384
384
|
}
|
|
385
385
|
```
|
|
386
386
|
|
|
387
|
+
### Amp
|
|
388
|
+
|
|
389
|
+
#### Server Setup
|
|
390
|
+
|
|
391
|
+
The server runs on port `9567` and interfaces with the [Amp SDK](https://ampcode.com/manual/sdk). Add to your `package.json`:
|
|
392
|
+
|
|
393
|
+
```json
|
|
394
|
+
{
|
|
395
|
+
"scripts": {
|
|
396
|
+
"dev": "npx @react-grab/amp@latest && next dev"
|
|
397
|
+
}
|
|
398
|
+
}
|
|
399
|
+
```
|
|
400
|
+
|
|
401
|
+
> **Note:** You must have an [Amp API key](https://ampcode.com/settings) set via `AMP_API_KEY` environment variable.
|
|
402
|
+
|
|
403
|
+
#### Client Setup
|
|
404
|
+
|
|
405
|
+
```html
|
|
406
|
+
<script src="//unpkg.com/grab/dist/index.global.js"></script>
|
|
407
|
+
<!-- add this in the <head> -->
|
|
408
|
+
<script src="//unpkg.com/@react-grab/amp/dist/client.global.js"></script>
|
|
409
|
+
```
|
|
410
|
+
|
|
411
|
+
Or using Next.js `Script` component in your `app/layout.tsx`:
|
|
412
|
+
|
|
413
|
+
```jsx
|
|
414
|
+
import Script from "next/script";
|
|
415
|
+
|
|
416
|
+
export default function RootLayout({ children }) {
|
|
417
|
+
return (
|
|
418
|
+
<html>
|
|
419
|
+
<head>
|
|
420
|
+
{process.env.NODE_ENV === "development" && (
|
|
421
|
+
<>
|
|
422
|
+
<Script
|
|
423
|
+
src="//unpkg.com/grab/dist/index.global.js"
|
|
424
|
+
strategy="beforeInteractive"
|
|
425
|
+
/>
|
|
426
|
+
<Script
|
|
427
|
+
src="//unpkg.com/@react-grab/amp/dist/client.global.js"
|
|
428
|
+
strategy="lazyOnload"
|
|
429
|
+
/>
|
|
430
|
+
</>
|
|
431
|
+
)}
|
|
432
|
+
</head>
|
|
433
|
+
<body>{children}</body>
|
|
434
|
+
</html>
|
|
435
|
+
);
|
|
436
|
+
}
|
|
437
|
+
```
|
|
438
|
+
|
|
387
439
|
## Extending React Grab
|
|
388
440
|
|
|
389
441
|
React Grab provides an public customization API. Check out the [type definitions](https://github.com/aidenybai/react-grab/blob/main/packages/react-grab/src/types.ts) to see all available options for extending React Grab.
|