Support TypeScript out of the box

[sapegin]

• Upgrade react-docgen to 5.0.0 beta (Upgrade react-docgen to 5.0.0 beta #1354)
• Tweak default components and ignore patterns to include .ts and .tsx.
• Tweak default extensions in webpack config to include .ts and .tsx.
• Update docs maybe (search for typescript and see if the information is still relevant).

[stereobooster]

I do not want to open an separate issue, because I'm not sure if this an issue of styleguidist or my setup. I bootstrapped project with https://github.com/wmonk/create-react-app-typescript

My config is:

const path = require("path");
module.exports = {
  propsParser: require("react-docgen-typescript").withCustomConfig(
    "./tsconfig.json"
  ).parse
};

I get the following error

InvalidCharacterError: Failed to execute 'createElement' on 'Document': The tag name provided ('static/media/Navbar.b192c68a.tsx

UPD: fixed by adding this to the config

webpackConfig: require("react-scripts-ts/config/webpack.config.dev.js")

[nwinger]

Experiencing the same issue as @stereobooster running create-react-app my-app --scripts-version=react-scripts-ts.

My config looks like this:

const path = require('path');

module.exports = {
  components: 'src/components/**/*.{ts,tsx}',
  propsParser: require('react-docgen-typescript').parse,
  webpackConfig: require('react-scripts-ts/config/webpack.config.dev.js'),
  styleguideComponents: {
    StyleGuideRenderer: path.join(
      __dirname,
      'lib/styleguide/StyleGuideRenderer'
    )
  }
};

[nwinger]

Update:
Had a colleague look at this, and he suggested we looked into the webpack.config.dev.js from react-scripts-ts. Sure enough, I'd placed my "lib" folder where the docs suggested, but I had to move it inside of source as the loader is looking in that directory for ts and tsx files.

[okonet]

@sapegin I might need this and could work on this. I'm not sure about the second step, though. Any pointers?

[sapegin]

@okonet Probably that's what withDefaultConfig is doing but the docs aren't super clear on that, and I haven't looked at the code. Similar to how we (and webpack) load webpack.config.js by default — load tsconfig.json by default like TypeScript does.

[bebraw]

Make react-docgen-typescript support default export the way they work in Styleguidist for JavaScript.

I think that's done by now.

Make react-docgen-typescript read users’s tsconfig.json by default.

Seems to work.

Automatically enable react-docgen-typescript for TypeScript projects (check typescript in devDependencies?

I need a spec for this. How should we depend on react-docgen-typescript? What's the preferred approach? It doesn't come with any deps and it's controlled. I have a basic setup to adapt.