async
lifecycle
browser
utilities
Install the package
npm install @siberiacancode/reactuseConfigure path aliases
Add baseUrl and paths to your tsconfig.json (or jsconfig.json) so imports resolve correctly:
{
"compilerOptions": {
"paths": {
"@/*": ["./src/*"]
}
}
}Adjust the @/* path to match your project structure (e.g. "./*" if you have no src folder).
Run the CLI
Run the useverse init command to setup your project:
npx useverse@latest initThis will create a configuration file reactuse.json in your project and configure where hooks are generated (e.g. @/shared/hooks).
Add hooks
Add hooks to your project with the CLI:
npx useverse@latest add useBooleanThen import and use them:
import { useBoolean } from '@/shared/hooks';
const App = () => {
const [on, toggle] = useBoolean();
return (
<div>
<button type='button' onClick={() => toggle()}>
Toggle
</button>
<p>{on.toString()}</p>
</div>
);
};If you prefer not to use the CLI, you can import hooks directly from the package:
import { useBoolean } from '@siberiacancode/reactuse';