{"_id":"@uiw/react-iframe","_rev":"6-7a36e3beadb20b737d9d2e1f3f5b9dbe","name":"@uiw/react-iframe","dist-tags":{"latest":"1.0.4"},"versions":{"0.0.1":{"name":"@uiw/react-iframe","version":"0.0.1","keywords":["react-iframe","react.js","react","template","monorepo","monorepo-template","uiw","uiw-react","react-component","component","iframe","components","ui","css","uikit","react-ui","framework"],"author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"license":"MIT","_id":"@uiw/react-iframe@0.0.1","maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"homepage":"https://uiwjs.github.io/react-iframe","bugs":{"url":"https://github.com/uiwjs/react-iframe/issues"},"dist":{"shasum":"b936ab1b106fa30c9b61cbd20b347cb73a7492a8","tarball":"https://registry.npmjs.org/@uiw/react-iframe/-/react-iframe-0.0.1.tgz","fileCount":7,"integrity":"sha512-92M0hXNL2gxda1x0OWUV3g7VfgtcafSq+7aKd0ahbxGksfbGOP13FimtmHeiWghwGFoT077aJGZxtRij8g0fTg==","signatures":[{"sig":"MEUCIDgXJ0LURyDnsIaDWNHIjr6tdC8/YHgXQ5h7BLdk7rFxAiEAlyGkUQ7k2VYFcz/T9m2ZTeYMKKcWRUItPJGwYECeI4k=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":16741},"main":"./cjs/index.js","types":"./cjs/index.d.ts","module":"./esm/index.js","gitHead":"c092b20bef890a1c796166a2c313c515fd18cc6c","_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"repository":{"url":"git+https://github.com/uiwjs/react-iframe.git","type":"git"},"_npmVersion":"8.19.4","description":"This component allows you to wrap your entire React application or each component in an iFrame.","directories":{},"_nodeVersion":"16.20.2","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.2.0","react-dom":"^18.2.0","@types/react":"^18.0.17","@babel/runtime":"^7.18.9","@types/react-dom":"^18.0.6","react-test-renderer":"^18.2.0","@types/react-test-renderer":"^18.0.0"},"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"_npmOperationalInternal":{"tmp":"tmp/react-iframe_0.0.1_1693902013982_0.5124723094865138","host":"s3://npm-registry-packages"}},"1.0.0":{"name":"@uiw/react-iframe","version":"1.0.0","keywords":["react-iframe","react.js","react","template","monorepo","monorepo-template","uiw","uiw-react","react-component","component","iframe","components","ui","css","uikit","react-ui","framework"],"author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"license":"MIT","_id":"@uiw/react-iframe@1.0.0","maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"homepage":"https://uiwjs.github.io/react-iframe","bugs":{"url":"https://github.com/uiwjs/react-iframe/issues"},"dist":{"shasum":"85e334a0ab844929163d10a3e6155c98d0520bdd","tarball":"https://registry.npmjs.org/@uiw/react-iframe/-/react-iframe-1.0.0.tgz","fileCount":12,"integrity":"sha512-N32fthrdulrbENFYguGUsqGo2DJMcvzfwohBl2t2q/GHmGUizRRhyy0vdZeUvHKpXjyy/WXX0C4cLK5lPRwrmA==","signatures":[{"sig":"MEUCIQDqt5m/MQGZYts6KIa6Abv3ekPGCD2/rCgVOot/hH2FIwIgG0nH4q+o7Dal08RPFjtrsNIh4RAFnjIWs8yOvobUOyQ=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":21292},"main":"./cjs/index.js","types":"./cjs/index.d.ts","module":"./esm/index.js","gitHead":"d9b564dbee419140a7d04915039f821b187a8027","_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"repository":{"url":"git+https://github.com/uiwjs/react-iframe.git","type":"git"},"_npmVersion":"8.19.4","description":"This component allows you to wrap your entire React application or each component in an iFrame.","directories":{},"_nodeVersion":"16.20.2","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.2.0","react-dom":"^18.2.0","@types/react":"^18.0.17","@babel/runtime":"^7.18.9","@types/react-dom":"^18.0.6","react-test-renderer":"^18.2.0","@types/react-test-renderer":"^18.0.0"},"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"_npmOperationalInternal":{"tmp":"tmp/react-iframe_1.0.0_1693913048560_0.6313836399427608","host":"s3://npm-registry-packages"}},"1.0.1":{"name":"@uiw/react-iframe","version":"1.0.1","keywords":["react-iframe","react.js","react","template","monorepo","monorepo-template","uiw","uiw-react","react-component","component","iframe","components","ui","css","uikit","react-ui","framework"],"author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"license":"MIT","_id":"@uiw/react-iframe@1.0.1","maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"homepage":"https://uiwjs.github.io/react-iframe","bugs":{"url":"https://github.com/uiwjs/react-iframe/issues"},"dist":{"shasum":"8528068302b31030b712d026d358085c0002236b","tarball":"https://registry.npmjs.org/@uiw/react-iframe/-/react-iframe-1.0.1.tgz","fileCount":12,"integrity":"sha512-vUxL4ymHa1vZBBe+ZK7aVYLWd7bCuIbmOVMN13uJkMj0wy4TFIFLKqeT3YQXAwfbZkvaw7RaaoWxhxbmJpfCiA==","signatures":[{"sig":"MEUCIQDtRV+HCw+Kd8+nwD8sGP/BRTXoirGqi0FBTV1L/TZTYAIgEatU0vr6KXEICpFLMZ9auRX0w6iTPU7fB30zta8hrhk=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":23936},"main":"./cjs/index.js","types":"./cjs/index.d.ts","module":"./esm/index.js","gitHead":"0689f80fcb85d04e41e1fdb252e0a6d4b35e3b47","_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"repository":{"url":"git+https://github.com/uiwjs/react-iframe.git","type":"git"},"_npmVersion":"8.19.4","description":"This component allows you to wrap your entire React application or each component in an iFrame.","directories":{},"_nodeVersion":"16.20.2","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.2.0","react-dom":"^18.2.0","@types/react":"^18.0.17","@babel/runtime":"^7.18.9","@types/react-dom":"^18.0.6","react-test-renderer":"^18.2.0","@types/react-test-renderer":"^18.0.0"},"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"_npmOperationalInternal":{"tmp":"tmp/react-iframe_1.0.1_1693915805675_0.35591923604825526","host":"s3://npm-registry-packages"}},"1.0.2":{"name":"@uiw/react-iframe","version":"1.0.2","keywords":["react-iframe","react.js","react","template","monorepo","monorepo-template","uiw","uiw-react","react-component","component","iframe","components","ui","css","uikit","react-ui","framework"],"author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"license":"MIT","_id":"@uiw/react-iframe@1.0.2","maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"homepage":"https://uiwjs.github.io/react-iframe","bugs":{"url":"https://github.com/uiwjs/react-iframe/issues"},"dist":{"shasum":"cc8b64a25570f01584f98a0371c81ac6d1be37ae","tarball":"https://registry.npmjs.org/@uiw/react-iframe/-/react-iframe-1.0.2.tgz","fileCount":12,"integrity":"sha512-o+p4YCUg1uPuptotU3V5sHFPLdXeqV96Jc5czj8lJMwt+K6KuEONWWBAx13YlDQbD7dvujjRYY+ppRL42vlmnQ==","signatures":[{"sig":"MEYCIQCS5z1MBK0kj4r2AvrSL1xLaxR1N4KtCiokxFpdlJEDKgIhAMigNRalbSorbyNxRTvwZLH2frIzetgtJT7LznV+igNi","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@uiw%2freact-iframe@1.0.2","provenance":{"predicateType":"https://slsa.dev/provenance/v0.2"}},"unpackedSize":23900},"main":"./cjs/index.js","types":"./cjs/index.d.ts","module":"./esm/index.js","gitHead":"d502b409abbe93d377f648d570571dc1133f4484","_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"repository":{"url":"git+https://github.com/uiwjs/react-iframe.git","type":"git"},"_npmVersion":"9.6.7","description":"This component allows you to wrap your entire React application or each component in an iFrame.","directories":{},"_nodeVersion":"18.17.1","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.2.0","react-dom":"^18.2.0","@types/react":"^18.0.17","@babel/runtime":"^7.18.9","@types/react-dom":"^18.0.6","react-test-renderer":"^18.2.0","@types/react-test-renderer":"^18.0.0"},"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"_npmOperationalInternal":{"tmp":"tmp/react-iframe_1.0.2_1695436731795_0.49963943631289287","host":"s3://npm-registry-packages"}},"1.0.3":{"name":"@uiw/react-iframe","version":"1.0.3","keywords":["react-iframe","react.js","react","template","monorepo","monorepo-template","uiw","uiw-react","react-component","component","iframe","components","ui","css","uikit","react-ui","framework"],"author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"license":"MIT","_id":"@uiw/react-iframe@1.0.3","maintainers":[{"name":"uiwjs","email":"kennyiseeyou@gmail.com"},{"name":"wcjiang","email":"398188662@qq.com"}],"homepage":"https://uiwjs.github.io/react-iframe","bugs":{"url":"https://github.com/uiwjs/react-iframe/issues"},"dist":{"shasum":"1073f0bc8c07fb3de332de17acd5a15b15b5d143","tarball":"https://registry.npmjs.org/@uiw/react-iframe/-/react-iframe-1.0.3.tgz","fileCount":12,"integrity":"sha512-lWBYRnAkP59rdMg+m5mQBc2Rlu7309xev/zr9P7MBtNOAgE3RTedn8MGGxThOS8DQdZTXE/1qgHV2Op2BwHOIg==","signatures":[{"sig":"MEYCIQD7GiGwSoUg8vXo5qzHlmJRNOxLIzTdiQlYPrAc5DQnXwIhAJIDxcUo3cw0vyz7Z5j7W7AsWP78JRUrRe23WA+kxbeW","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@uiw%2freact-iframe@1.0.3","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"unpackedSize":25294},"main":"./cjs/index.js","types":"./cjs/index.d.ts","module":"./esm/index.js","gitHead":"91e870b1bf926fad01d1e67cacfd0ffd484ce170","_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"repository":{"url":"git+https://github.com/uiwjs/react-iframe.git","type":"git"},"_npmVersion":"10.2.4","description":"This component allows you to wrap your entire React application or each component in an iFrame.","directories":{},"_nodeVersion":"18.19.1","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"react":"^18.2.0","react-dom":"^18.2.0","@types/react":"^18.0.17","@babel/runtime":"^7.18.9","@types/react-dom":"^18.0.6","react-test-renderer":"^18.2.0","@types/react-test-renderer":"^18.0.0"},"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"_npmOperationalInternal":{"tmp":"tmp/react-iframe_1.0.3_1709200941716_0.8677321681613706","host":"s3://npm-registry-packages"}},"1.0.4":{"name":"@uiw/react-iframe","version":"1.0.4","description":"This component allows you to wrap your entire React application or each component in an iFrame.","author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"homepage":"https://uiwjs.github.io/react-iframe","repository":{"type":"git","url":"git+https://github.com/uiwjs/react-iframe.git"},"license":"MIT","main":"./cjs/index.js","module":"./esm/index.js","publishConfig":{"access":"public"},"keywords":["react-iframe","react.js","react","template","monorepo","monorepo-template","uiw","uiw-react","react-component","component","iframe","components","ui","css","uikit","react-ui","framework"],"peerDependencies":{"react":">=16.9.0","react-dom":">=16.9.0"},"devDependencies":{"@babel/runtime":"^7.18.9","@types/react":"^18.0.17","@types/react-dom":"^18.0.6","@types/react-test-renderer":"^18.0.0","react":"^18.2.0","react-dom":"^18.2.0","react-test-renderer":"^18.2.0"},"_id":"@uiw/react-iframe@1.0.4","gitHead":"d77521b7ab85aee50b712d43471a2541e1a21404","types":"./cjs/index.d.ts","bugs":{"url":"https://github.com/uiwjs/react-iframe/issues"},"_nodeVersion":"18.20.8","_npmVersion":"10.8.2","dist":{"integrity":"sha512-rXjLQ6HBxTBuA4UYjbCHo1DOzxxeEtJMC59rSG35bQ9vzb/a1ssxK7/e8ku/NZCYtCswDj02CMAffXIZRLeM5Q==","shasum":"2ed83a2115f0b31092735528929cf266eba0475f","tarball":"https://registry.npmjs.org/@uiw/react-iframe/-/react-iframe-1.0.4.tgz","fileCount":12,"unpackedSize":25236,"attestations":{"url":"https://registry.npmjs.org/-/npm/v1/attestations/@uiw%2freact-iframe@1.0.4","provenance":{"predicateType":"https://slsa.dev/provenance/v1"}},"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIGAfL4eyDD82v+sAz56CJzf1GMSH/Zbq6TrZzI3sRogLAiBEUpAPVD3M4sfoU2dczOZ4nl7nALCiO86Oj0I963gL+w=="}]},"_npmUser":{"name":"wcjiang","email":"398188662@qq.com"},"directories":{},"maintainers":[{"name":"wcjiang","email":"398188662@qq.com"},{"name":"uiwjs","email":"kennyiseeyou@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-iframe_1.0.4_1746151710265_0.6751595729548421"},"_hasShrinkwrap":false}},"time":{"created":"2023-09-05T08:20:13.853Z","modified":"2025-05-02T02:08:30.875Z","0.0.1":"2023-09-05T08:20:14.135Z","1.0.0":"2023-09-05T11:24:08.722Z","1.0.1":"2023-09-05T12:10:05.838Z","1.0.2":"2023-09-23T02:38:51.994Z","1.0.3":"2024-02-29T10:02:21.850Z","1.0.4":"2025-05-02T02:08:30.457Z"},"bugs":{"url":"https://github.com/uiwjs/react-iframe/issues"},"author":{"name":"Kenny Wong","email":"wowohoo@qq.com"},"license":"MIT","homepage":"https://uiwjs.github.io/react-iframe","keywords":["react-iframe","react.js","react","template","monorepo","monorepo-template","uiw","uiw-react","react-component","component","iframe","components","ui","css","uikit","react-ui","framework"],"repository":{"type":"git","url":"git+https://github.com/uiwjs/react-iframe.git"},"description":"This component allows you to wrap your entire React application or each component in an iFrame.","maintainers":[{"name":"wcjiang","email":"398188662@qq.com"},{"name":"uiwjs","email":"kennyiseeyou@gmail.com"}],"readme":"react-iframe\n===\n\n[![Build & Deploy](https://github.com/uiwjs/react-iframe/actions/workflows/ci.yml/badge.svg)](https://github.com/uiwjs/react-iframe/actions/workflows/ci.yml)\n[![Coverage Status](https://uiwjs.github.io/react-iframe/badges.svg)](https://uiwjs.github.io/react-iframe/coverage/lcov-report/)\n[![npm version](https://img.shields.io/npm/v/@uiw/react-iframe.svg)](https://www.npmjs.com/package/@uiw/react-iframe)\n\nThis component allows you to wrap your entire React application or each component in an [`<iframe>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe).\n## Features\n\n📚 Use Typescript to write, better code hints.  \n📦 Zero dependencies.  \n🐝 Encapsulation based on function components.  \n🍄 Provides comprehensive code test coverage.  \n🌐 Complete official document [demo preview](https://uiwjs.github.io/react-iframe/).  \n\n## Installation\n\n```bash\nnpm i @uiw/react-iframe\n```\n\n## Basic Usage\n\n```jsx mdx:preview\nimport React from 'react';\nimport IFrame from '@uiw/react-iframe';\n\nexport default function Demo() {\n  return (\n    <IFrame>\n      <h1>Hello World!</h1>\n    </IFrame>\n  );\n}\n```\n\n## `head`\n\nThe `head` prop is a dom node that gets inserted before the children of the frame. \n\n```jsx mdx:preview\nimport React from 'react';\nimport IFrame from '@uiw/react-iframe';\n\nconst head = (\n  <style>{`body { background: red; }`}</style>\n);\n\nexport default function Demo() {\n  return (\n    <IFrame head={head}>\n      <h1>Hello World!</h1>\n    </IFrame>\n  );\n}\n```\n\n## `initialContent`\n\nThe `initialContent` props is the initial html injected into frame. It is only injected once, but allows you to insert any html into the frame (e.g. a [`<head>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/head) tag, [`<script>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script) tags, etc). Note that it does not update if you change the prop. \n\nDefaults to `<!DOCTYPE html><html><head></head><body></body></html>`\n\n```jsx mdx:preview\nimport React from 'react';\nimport IFrame from '@uiw/react-iframe';\n\nconst initialContent = '<!DOCTYPE html><html><head><title>React IFrame</title><meta name=\"keywords\" content=\"react,iframe,component,development\" /></head><body></body></html>';\n\nexport default function Demo() {\n  return (\n    <IFrame initialContent={initialContent}>\n      <div style={{ fontSize: 32, color: 'red' }}>Hello World!</div>\n    </IFrame>\n  );\n}\n```\n\n## `mountTarget`\n\nThe `mountTarget` attribute is a css selector (`#target`/`.target`) that specifies the child within the initial content of the iframe to be mounted.\n\n```jsx mdx:preview\nimport React from 'react';\nimport IFrame from '@uiw/react-iframe';\n\nconst initialContent = '<!DOCTYPE html><html><head></head><body><h1>i wont be changed</h1><div id=\"mountHere\"></div></body></html>';\n\nexport default function Demo() {\n  return (\n    <IFrame initialContent={initialContent} mountTarget=\"#mountHere\">\n      <div style={{ fontSize: 32, color: 'red' }}>Hello World!</div>\n    </IFrame>\n  );\n}\n```\n\n## `ref`\n\nThe ref prop provides a way to access inner [`<iframe>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe) DOM node.\n\n```tsx mdx:preview\nimport React, { useEffect, useState, Fragment } from 'react';\nimport IFrame from '@uiw/react-iframe';\n\nexport default function Demo() {\n  const [iframeRef, setIframeRef] = useState();\n  const [count, setCount] = useState(0);\n\n  useEffect(() => {\n    if (iframeRef) {\n      iframeRef.focus();\n    }\n  }, [iframeRef]);\n\n  const click = () => setCount(count + 1);\n  return (\n    <Fragment>\n      <button onClick={click} style={{ display: 'flex' }}>Click</button>\n      <IFrame ref={(node) => node && setIframeRef(node)}>\n        <div>Hello World!</div>\n        <div style={{ fontSize: 32, color: 'red' }}>{count}</div>\n      </IFrame>\n    </Fragment>\n  );\n}\n```\n\n## `src`\n\nOpen a URL in an [`<iframe>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe).\n\n```tsx mdx:preview\nimport React, { useEffect, useState, Fragment } from 'react';\nimport IFrame from '@uiw/react-iframe';\n\nexport default function Demo() {\n  return (\n    <IFrame src=\"https://wangchujiang.com/\" style={{ width: '100%', height: 320 }} />\n  );\n}\n```\n\n## Accessing the iframe's `window` and `document`\n\nThe iframe's `window` and `document` may be accessed via the `FrameContext.Consumer` or the useFrame hook.\n\n```tsx mdx:preview\nimport React, { useEffect, useState, Fragment } from 'react';\nimport IFrame, { FrameContext } from '@uiw/react-iframe';\n\nexport default function Demo() {\n  return (\n    <IFrame>\n      <FrameContext.Consumer>\n        {({ document, window }) => {\n          return (\n            <div>\n              <div>Hello World!</div>\n            </div>\n          )\n        }}\n      </FrameContext.Consumer>\n    </IFrame>\n  );\n}\n```\n\nThe example with `useFrame` hook:\n\n```tsx mdx:preview\nimport React, { useEffect, useState, Fragment } from 'react';\nimport IFrame, { useFrame } from '@uiw/react-iframe';\n\nconst InnerComponent = () => {\n  // Hook returns iframe's window and document instances from Frame context\n  const { document, window } = useFrame();\n  return (\n    <div>\n      <div>Hello World!</div>\n    </div>\n  );\n};\n\nexport default function Demo() {\n  return (\n    <IFrame>\n      <InnerComponent />\n    </IFrame>\n  );\n}\n```\n\n## Event\n\n```tsx mdx:preview\nimport React, { useEffect, useState, Fragment } from 'react';\nimport IFrame, { useFrame } from '@uiw/react-iframe';\n\nconst InnerComponent = () => {\n  // Hook returns iframe's window and document instances from Frame context\n  const { document, window } = useFrame();\n  return (\n    <div>\n      <div>Hello World!</div>\n    </div>\n  );\n};\n\nexport default function Demo() {\n  const onLoad = (evn) => {\n    console.log(\"iframe loaded successfully!\", evn)\n  }\n  return (\n    <IFrame onLoad={onLoad}>\n      <InnerComponent />\n    </IFrame>\n  );\n}\n```\n\n## Props\n\n```ts\nexport interface IFrameProps extends React.HTMLAttributes<HTMLIFrameElement> {\n  head?: React.ReactNode;\n  initialContent?: string;\n  mountTarget?: string;\n}\ndeclare const IFrame: import(\"react\").ForwardRefExoticComponent<IFrameProps & import(\"react\").RefAttributes<HTMLIFrameElement>>;\nexport default IFrame;\n```\n\n## Development\n\nRuns the project in development mode.  \n\n```bash\n# Step 1, run first, listen to the component compile and output the .js file\n# listen for compilation output type .d.ts file\nnpm run watch\n# Step 2, development mode, listen to compile preview website instance\nnpm run start\n```\n\nBuilds the app for production to the build folder.\n\n```bash\nnpm run build\n```\n\nThe build is minified and the filenames include the hashes.\nYour app is ready to be deployed!\n\n\n## Contributors\n\nAs always, thanks to our amazing contributors!\n\n<a href=\"https://github.com/uiwjs/react-iframe/graphs/contributors\">\n  <img src=\"https://uiwjs.github.io/react-iframe/CONTRIBUTORS.svg\" />\n</a>\n\nMade with [contributors](https://github.com/jaywcjlove/github-action-contributors).\n\n## License\n\nLicensed under the MIT License.","readmeFilename":"README.md"}