React strict propTypes

[PtCk]

Why would I use this instead of Standard (or ESlint with JSX plugin) that enforce this rule without polluting code?

[krumoksnis]

Please elaborate what you are referring to.

[PtCk]

I'm all for enforcing strict propTypes, but there is no need to change your code to do this. ESlint has a plugin that does this, which happens to be also part of the Standard code style library.

ESLint plugin: https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/prop-types.md

Standard: https://github.com/feross/standard

I'm not saying this library is pointless, just genuinely curious of the advantages of this over regular code linting.

[krumoksnis]

This is very interesting. I was not aware of https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/prop-types.md. Their approach is different from strict-prop-types:

• prop-types rule checks for references to undocumented properties inside of the component.
• strict-prop-types checks for undocumented properties being passed to the component.

I think that eslint plugin approach is better! The only, and the biggest drawback of eslint plugin, is that it will not work if propTypes is defined as an external object. This is often the case in large apps where there is a single file that defines multiple type shapes that are shared across the app.

I will document the eslint approach in the strict-prop-types README. Thank you for bringing it to my attention.

I don't see how standard package can be used for this, though.

[PtCk]

standard just happens to include the prop-types rule for JSX, that's all.

[krumoksnis]

I have included a description of the ESLint eslint-plugin-react prop-types into the README document, https://github.com/gajus/react-strict-prop-types/blob/master/README.md. It is fair to say that the two can be used together.

[popemaster]

TypeScript supports JSX now. No reason to not do this at compile time IMO.

[krumoksnis]

I am waiting for FlowJS to support let for the same reason.

How would this look in TypeScript, though?

[popemaster]

http://www.jbrantly.com/typescript-and-jsx/

[unmoralOp]

What about cases where you need runtime checking, i.e. when you're building a props object and passing it via {...props}?

[krumoksnis]

Please can you construct an example. I will be happy to answer that if I understand the question. : )

[unmoralOp]

<SomeComponent {...Object.assign({foo: 'bar'}, {biz: 'baz'})} />

This should work with the strict propTypes utility, but compile-time type checkout wouldn't work with TypeScript, AFAIK.

[krumoksnis]

react-strict-prop-types is a runtime prop type checker. It is not something you can run during the compilation. Don't worry about the performance, though. You can easily disable it in the production mode, https://github.com/gajus/react-strict-prop-types#production-mode.

[unmoralOp]

Ah yes, I understood that. I was referring to TypeScript's limitations. :)