0.0.1 • Published 10 months ago

react-filebased-router v0.0.1

Weekly downloads
-
License
ISC
Repository
github
Last release
10 months ago

react-filebased-router

Install

installing with npm :

npm i react-filebased-router

installing with yarn :

yarn add react-filebased-router

Property Description Type Default

Property

PropertyDescriptionTypeDefault
basenameSets the base path for the router. This value is added to all routes.string'/'
custom404Allows you to set a custom 404 page component. This component will be used when a 404 page is needed.React.ComponentType or React.ReactElementNot Found

Example

/* App.tsx */
import FileBasedRouter from 'react-filebased-router';

export const App = () => {
  return <FileBasedRouter />;
};

After configuring App.tsx as above, you should have the following file structure.

src
│
├── App.tsx
├── FileBasedRouter.tsx
├── index.tsx
│
└── pages
    ├── index.tsx
    ├── login.tsx
    │
    ├── community
    │   ├── index.tsx
    │   └── [id].tsx
    │
    └── [username]
        ├── index.tsx
        └── profile.tsx

The file structure like the one above will be matched as follows. | URL Path | File Path | |------------------------------|----------------------------------| | {baseurl} | pages/index.tsx | | {baseurl}/login | pages/login.tsx | | {baseurl}/community | pages/community/[id].tsx | | {baseurl}/community/{id} | pages/community/index.tsx | | {baseurl}/{username} | pages/[username]/index.tsx | | {baseurl}/{username}/profile | pages/[username]/profile.tsx |

0.0.1

10 months ago

0.0.0

10 months ago