This directory contains example applications that demonstrate how to use @forward-software/react-auth. They exist for documentation and manual testing purposes only — they are not published to npm and are not part of the pnpm workspace.
| Example | Path | Description |
|---|---|---|
| Base | base/ |
Minimal Vite + React example |
| ReqRes | reqres/ |
Authenticates against the ReqRes API |
| Refresh Token | refresh-token/ |
Token refresh with Axios interceptors |
| Expo | expo/ |
React Native (Expo) integration |
| Showcase | showcase/ |
Comprehensive example of all library features |
Each example manages its own dependencies. To run one, install its dependencies first and then start the dev server:
# Vite-based examples (base, reqres, refresh-token, showcase)
cd examples/<name>
pnpm install
pnpm dev
# Expo example
cd examples/expo
pnpm install # or: npx pod-install (iOS only, after pnpm install)
npx expo startTip: If you have already run
pnpm installat the monorepo root, the examples resolve@forward-software/react-authto the local lib source automatically (see below). You still need topnpm installinside the example directory to install its own dependencies.
Example apps follow a two-layer convention for depending on @forward-software/react-auth:
-
package.json— lists the latest published version (e.g."2.1.0"). This makes the example usable as a standalone project after cloning. -
Build-tool / TypeScript alias — when developing inside the monorepo, the bundler resolves the import to the local lib source (
../../lib/src/index.ts). This means any change you make tolib/is reflected immediately in the example without a separate build step.
Configure the alias in two places:
vite.config.ts
import path from 'node:path';
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
export default defineConfig({
plugins: [react()],
resolve: {
alias: {
'@forward-software/react-auth': path.resolve(__dirname, '../../lib/src/index.ts'),
},
},
// ...
});tsconfig.json (under compilerOptions)
{
"paths": {
"@forward-software/react-auth": ["./../../lib/src/index.ts"]
}
}Configure the alias in babel.config.js using babel-plugin-module-resolver:
module.exports = function (api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
plugins: [
['module-resolver', { alias: { '@forward-software/react-auth': '../../lib' } }],
],
};
};And a matching paths entry in tsconfig.json under compilerOptions for IDE/tsc resolution (uses a wildcard because expo/tsconfig.base does not need baseUrl):
{
"paths": {
"@forward-software/react-auth/*": ["../../lib/*"]
}
}- Create the example under
examples/<name>/. - Add
@forward-software/react-authas a dependency with the current published version inpackage.json. - Configure the bundler path alias and TypeScript
pathsmapping as shown above. - Mark the package as
"private": trueinpackage.json. - Do not add the example to
pnpm-workspace.yaml— examples manage their own dependencies independently. - Add the example to the table in this README and to the examples list in
CONTRIBUTING.mdandAGENTS.md.