guess-parser
This module is used for route extraction by the GuessPlugin
. The module exports several functions:
Usage
npm i guess-parser --save-dev
API
detect(path: string)
- Detects the project type and returns metadata. For the currently supported projects see the ProjectMetadata
interface.parseRoutes(path: string)
- Extracts the routes of the application in path
. Internally uses the detect
function.parseAngularRoutes(tsconfig: string)
- Extracts the routes of an Angular application. As arguments the function accepts path to the tsconfig.json
file of the project.parseReactJSXRoutes(path: string)
- Extracts the routes from React JSX project. See the supported syntax below.parseReactTSXRoutes(tsconfig: string)
- Extracts the routes from React TypeScript projects which uses JSX by tsconfig.json
file. See the supported syntax below.
export interface ProjectMetadata {
type: ProjectType;
version: string;
details?: ProjectLayout;
}
export enum ProjectType {
AngularCLI = 'angular-cli',
CreateReactApp = 'create-react-app',
Gatsby = 'gatsby',
CreateReactAppTypeScript = 'create-react-app-typescript'
}
export interface ProjectLayout {
typescript?: string;
tsconfigPath?: string;
sourceDir?: string;
}
Supported Syntax
Angular
Because of the produced summaries by the Angular compiler the Angular parser supports most Angular CLI applications as well as most starters.
React
Because of the dynamic nature of React and lack of standard route definition syntax, only applications using the following convention can be successfully parsed:
<Router history={history}>
<div className="App">
<Link to="/intro">Intro</Link>
<Link to="/main">Main</Link>
<div>
<Switch>
<Redirect exact={true} from="/" to="/intro" />
<Route path="/intro" component={AsyncComponent(() => import('./intro/Intro'))} />
<Route path="/main" component={Main} />
</Switch>
</div>
</div>
</Router>
Currently, there are several important conventions:
- Support only for JSX syntax
- Support only for
react-router
-like syntax - The path attribute of the
<Route/>
element must have value of type string literal. - The lazy-loaded components should have dynamic import with the following structure of the AST:
CallExpression
(e.g. AsyncComponent
) with a single argument- The type of the argument should be an
ArrowFunction
- The arrow function should have an expression as body (e.g.
CallExpression
) - To the
CallExpression
should be passed a StringLiteral
which points to the lazy-loaded module
Contributions aiming to extend the supported syntax are very welcome!
License
MIT