esdoc / esdoc-plugins

MIT License
139 stars 74 forks source link

react tags not in output #47

Open jhvanderven opened 6 years ago

jhvanderven commented 6 years ago

Hi,

I am using esdoc version 1.0.4 for my create-react-app app and I am expericiencing some issues. I guess I am making a beginners fault, but I don't see where.

This is my .esdoc.json:

{
  "source": "./src",
  "destination": "./docs",
  "plugins": [
    {"name": "esdoc-jsx-plugin", "option": {"enable": true}},
    {
      "name": "esdoc-ecmascript-proposal-plugin",
      "option": {
        "enable":true,
        "classProperties": true,
        "objectRestSpread": true,
        "doExpressions": true,
        "functionBind": true,
        "functionSent": true,
        "asyncGenerators": true,
        "decorators": true,
        "exportExtensions": true,
        "dynamicImport": true
      }
    },
      {"name": "esdoc-standard-plugin"},
    {
      "name": "esdoc-react-plugin", 
      "option": {"enable": true}
    }
  ]
}

And I have for instance the following snippet as a Component:

** represents the App component. App has the url to the server as props. 
 *   @reactProps {String} url - The url of the server
 *   @example url="http://192.168.5.231:8099/json"
 */
class App extends Component {

  /**
   * creates an instance of the App component
   */
  constructor(){
    super();
  }

  /** showMessage 
    @param msg {string} - The error message
   */
  showMessage = (msg) => {
  }
}

In the output @reactProps is missing. And the showMessage is not recognized as a function, but as a member, which causes my params to be left out of the output.

I have tried to change the order of the plugins, but got the same result. Then I tried to leave some of them out, but that led to the expected parsing errors.

Can someone explain what I am doing wrong?

Thanks

Jan

pixelass commented 6 years ago

I see similar behavior whit Styled components

The following ReactComponent has no generated documentation

/**
 * A simple styled button that will change color from blue to red
 * @type {function}
 * @public
 * @reactProps {Boolean} active
 *   Active state of the button.
 * @example
 * <Button active>Active Button</Button>
 * <Button>Inactive Button</Button>
 */
export const Button = styled.button`
  background: ${({active}) => active ? 'red' : 'blue'}
`
pixelass commented 6 years ago

Seeing this on a class now too. I guess this feature is in general overly broken. Let's hope the maintainer ever reacts to our issues.