{"library":"react-native-helmet-async","title":"React Native Helmet Async","description":"react-native-helmet-async is a specialized fork of `react-helmet-async`, which itself is a modern, thread-safe solution for managing meta tags in React applications. This particular package addresses the specific needs of React Native by removing the `react-dom` peer dependency, making it suitable for environments where DOM rendering is not present. Its core differentiator is the use of a `<HelmetProvider>` component to encapsulate Helmet state on a per-request or per-tree basis, crucial for asynchronous server-side rendering (SSR) to prevent state pollution across requests. It is currently at version 2.0.4 and appears to be actively maintained, providing an essential tool for SEO and head management in React Native web applications (when used with a web renderer) and isomorphic React projects where `react-dom` is not desired. It solves the thread-safety issues inherent in the original `react-helmet`'s `react-side-effect` dependency.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install react-native-helmet-async"],"cli":null},"imports":["import { Helmet } from 'react-native-helmet-async';","import { HelmetProvider } from 'react-native-helmet-async';","HelmetProvider.canUseDOM = false;"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { Helmet, HelmetProvider } from 'react-native-helmet-async';\n\nconst App = () => (\n  <div>\n    <Helmet>\n      <title>My Awesome React Native Web App</title>\n      <link rel=\"canonical\" href=\"https://www.example.com/\" />\n      <meta name=\"description\" content=\"A test application for react-native-helmet-async\" />\n    </Helmet>\n    <h1>Welcome to the App!</h1>\n    <p>Check the document head for the meta tags.</p>\n  </div>\n);\n\nconst container = document.getElementById('root');\nif (container) {\n  const root = createRoot(container);\n  root.render(\n    <HelmetProvider>\n      <App />\n    </HelmetProvider>\n  );\n} else {\n  console.error('Root element not found. Please ensure an element with id \"root\" exists.');\n}\n","lang":"typescript","description":"This quickstart demonstrates basic client-side usage of Helmet and HelmetProvider to manage document head tags.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}