diff --git a/README.md b/README.md index 61b86c9e..0d3d0003 100644 --- a/README.md +++ b/README.md @@ -19,7 +19,13 @@ npm install --save-dev react-docgen-typescript Include following line in your `styleguide.config.js`: ```javascript -propsParser: require('react-docgen-typescript').parse +propsParser: require('react-docgen-typescript').withDefaultConfig() +``` + +or if you want to use custom tsconfig file + +```javascript +propsParser: require('react-docgen-typescript').withCustomConfig('./tsconfig.json') ``` ## Example diff --git a/package.json b/package.json index 2ca3174d..f6e2784d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-docgen-typescript", - "version": "1.0.0", + "version": "1.0.1", "description": "", "main": "lib/index.js", "scripts": { diff --git a/src/__tests__/parser.ts b/src/__tests__/parser.ts index 888587aa..ded9e80e 100644 --- a/src/__tests__/parser.ts +++ b/src/__tests__/parser.ts @@ -102,7 +102,7 @@ describe('parser', () => { }); }); - it('should parse react component with properties extended from an external .tsx file', function(){ + it.only('should parse react component with properties extended from an external .tsx file', function(){ check('ExtendsExternalPropsComponent', { ExtendsExternalPropsComponent: { children, diff --git a/src/index.ts b/src/index.ts index af6dcf58..743cdd72 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,5 +1,7 @@ import { parse, + withDefaultConfig, + withCustomConfig, ComponentDoc, Props, PropItem, @@ -8,6 +10,8 @@ import { export { parse, + withDefaultConfig, + withCustomConfig, ComponentDoc, Props, PropItem, diff --git a/src/parser.ts b/src/parser.ts index 3fe4211f..7e4d907b 100644 --- a/src/parser.ts +++ b/src/parser.ts @@ -24,23 +24,35 @@ export interface PropItemType { value?: any; } +export interface FileParser { + parse(filePath: string): ComponentDoc[]; +} + const defaultOptions: ts.CompilerOptions = { target: ts.ScriptTarget.Latest, - module: ts.ModuleKind.CommonJS + module: ts.ModuleKind.CommonJS, + jsx: ts.JsxEmit.React, }; /** * Parses a file with default TS options - * @param filePath + * @param filePath component file that should be parsed */ export function parse(filePath: string) { return withCompilerOptions(defaultOptions).parse(filePath); } +/** + * Constructs a parser for a default configuration. + */ +export function withDefaultConfig(): FileParser { + return withCompilerOptions(defaultOptions); +} + /** * Constructs a parser for a specified tsconfig file. */ -export function withConfig(tsconfigPath: string) { +export function withCustomConfig(tsconfigPath: string): FileParser { const configJson = JSON.parse(fs.readFileSync(tsconfigPath, 'utf8')); const basePath = path.dirname(tsconfigPath); @@ -58,7 +70,7 @@ export function withConfig(tsconfigPath: string) { /** * Constructs a parser for a specified set of TS compiler options. */ -export function withCompilerOptions(compilerOptions: ts.CompilerOptions) { +export function withCompilerOptions(compilerOptions: ts.CompilerOptions): FileParser { return { parse(filePath: string): ComponentDoc[] { const program = ts.createProgram([filePath], compilerOptions); @@ -89,7 +101,6 @@ class Parser { public getComponentInfo(exp: ts.Symbol, source: ts.SourceFile): ComponentDoc { const type = this.checker.getTypeOfSymbolAtLocation(exp, exp.valueDeclaration); - let propsType = this.extractPropsFromTypeIfStatelessComponent(type); if (!propsType) { propsType = this.extractPropsFromTypeIfStatefulComponent(type); @@ -160,6 +171,8 @@ class Parser { const result: Props = {}; propertiesOfProps.forEach(prop => { + console.log("parser.getPropsInfo prop: ", prop.name); + const propName = prop.getName();