A set of react components.
$ yarn
$ yarn start
Some material resources for reference.
Some notes about the problems when setup the project.
React hooks are in proposal and there's no official definition types. So we need to use a custom one from community.
Fortunatly there's a pending PR of DefinitelyTyped.
See the declartion file under definition
folder.
TypeScript complains there's no such children
property on props.
Give the Function Component the React.SFT
type will solve the problem.
interface IMyComponentProps{
//...
}
const MyComponent: React.SFC<IMyComponentProps> = props => {
return {props.children}
}
See more: React Stateless Functional Component with TypeScript
interface IMyComponentProps {
foo?: string;
}
const MyComponent: React.SFC<IMyComponentProps> = props => {
return props.foo.toUpperCase();
};
MyComponent.defaultProps = {
foo: "allo"
};
But TypeScript will continue conplains that props with default value possibly undefined
.
And there's an issue for the TypeScript.
Fortunatly, TypeScript 3 comes a solution for this (see the Support for defaultProps in JSX section):
interface IMyComponentProps {
foo?: string;
}
function MyComponent({ foo = "allo" }: IMyComponentProps) {
return foo.toUpperCase();
}
It just ignore and compile successfully. Related issue: 🐛 Not displaying or honoring Typescript errors
So we need to using a TypeScript plugin for parcel parcel-plugin-typescript. But seems not working with latest parcel, see the issue here and here