Package Exports
- only-on-client
- only-on-client/index.js
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (only-on-client) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
only-on-client
The only-on-client package provides a React component that ensures its children are only rendered on the client side. This is useful for components that rely on browser-specific APIs and should not be rendered during server-side rendering.
It renders its children only when executed in a client environment (e.g., a web browser), and does not render anything when executed in a server environment (e.g., Node.js).
Installation
You can install via npm:
npm install only-on-clientOr via yarn:
yarn add only-on-clientUsage
import React from "react";
import OnlyOnClient from "only-on-client";
export const App = () => (
<div>
<h1>My App</h1>
<OnlyOnClient>
<div>This content is rendered only on the client side.</div>
</OnlyOnClient>
</div>
);Props
It takes a single prop named children, which is of type ReactNode. You dont have to pass any prop explicitely.
Examples
Render a component only on the client side:
<OnlyOnClient>
<div>This content is rendered only on the client side.</div>
</OnlyOnClient>Development
If you want to contribute to the development of OnlyOnClient, you can clone the GitHub repository:
git clone https://github.com/ajitesh13/only-on-client.git
License
This project is licensed under the MIT License - see the LICENSE file for details.
Issues
If you encounter any issues or have suggestions for improvements, please open an issue on GitHub.