Skip to content

Commit 27085e9

Browse files
authored
Update README.md
1 parent 0a6f722 commit 27085e9

File tree

1 file changed

+13
-13
lines changed

1 file changed

+13
-13
lines changed

README.md

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -618,8 +618,8 @@ export const getTargetCurrencyRate = createSelector(
618618
# Extras
619619

620620
### tsconfig.json
621-
> Recommended setup for best benefits from type-checking, with support for JSX and ES2016 features.
622-
> `npm i tslib` - install [`tslib`](https://www.npmjs.com/package/tslib) dependency to externalize helper functions generated by transpiler and normally inlined in your modules to minimize bundle size
621+
> Recommended setup for best benefits from type-checking, with support for JSX and ES2016 features.
622+
> Add [`tslib`](https://www.npmjs.com/package/tslib) to minimize bundle size: `npm i tslib` - this will externalize helper functions generated by transpiler and otherwise inlined in your modules
623623
```js
624624
{
625625
"compilerOptions": {
@@ -664,9 +664,9 @@ export const getTargetCurrencyRate = createSelector(
664664
```
665665

666666
### tslint.json
667-
> Recommended setup is to extend build-in preset `tslint:latest` (for all rules use `tslint:all`)
667+
> Recommended setup is to extend build-in preset `tslint:latest` (for all rules use `tslint:all`).
668668
> Add tslint react rules: `npm i -D tslint-react` https://github.com/palantir/tslint-react
669-
> Amended some extended defaults for more flexibility
669+
> Amended some extended defaults for more flexibility.
670670
```json
671671
{
672672
"extends": ["tslint:latest", "tslint-react"],
@@ -702,8 +702,8 @@ export const getTargetCurrencyRate = createSelector(
702702
```
703703

704704
### Default and Named Module Exports
705-
> Most flexible solution is to use module folder pattern, because you can leverage both named and default import when you see fit.
706-
Using this solution you'll achieve better encapsulation for internal structure/naming refactoring without breaking your consumer code:
705+
> Most flexible solution is to use module folder pattern, because you can leverage both named and default import when you see fit.
706+
Using this solution you'll achieve better encapsulation for internal structure/naming refactoring without breaking your consumer code:
707707
```ts
708708
// 1. in `components/` folder create component file (`select.tsx`) with default export:
709709

@@ -728,7 +728,7 @@ import Select from '../components/select';
728728
```
729729
730730
### Vendor Types Augmentation
731-
> Augmenting missing autoFocus Prop on `Input` and `Button` components in `antd` npm package (https://ant.design/)
731+
> Augmenting missing autoFocus Prop on `Input` and `Button` components in `antd` npm package (https://ant.design/).
732732
```ts
733733
declare module '../node_modules/antd/lib/input/Input' {
734734
export interface InputProps {
@@ -756,15 +756,15 @@ npm i -D @types/react @types/react-dom @types/react-redux
756756
```
757757
758758
### - when to use `interface` and when `type` to behave consistently?
759-
> Use `type` when declaring simple object literal structs e.g. Component Props, Component State, Redux State, Redux Action.
760-
In other cases it's more flexible to use `interface` over `type` because interfaces can be implemented, extended and merged.
761-
Related `ts-lint` rule: https://palantir.github.io/tslint/rules/interface-over-type-literal/
759+
> Use `type` when declaring simple object literal structs e.g. Component Props, Component State, Redux State, Redux Action.
760+
In other cases it's more flexible to use `interface` over `type` because interfaces can be implemented, extended and merged.
761+
Related `ts-lint` rule: https://palantir.github.io/tslint/rules/interface-over-type-literal/
762762
763763
### - should I use React.PropTypes?
764-
> No. In TypeScript it is completely unnecessary, you will get a much better free type checking and intellisense at compile time when declaring a "generic type" for component: `React.Component<{ myProp: string }, { myState: number}>`, this way you'll never get any runtime errors and get elegant way of describing component external API.
764+
> No. In TypeScript it is completely unnecessary, you will get a much better free type checking and intellisense at compile time when declaring a "generic type" for component: `React.Component<{ myProp: string }, { myState: number}>`, this way you'll never get any runtime errors and get elegant way of describing component external API.
765765
766766
### - how to best declare component instance properties?
767-
> Don't use old-school React class constructors way, prefer to use Property Initializers (first class support in TypeScript)
767+
> Don't use old-school React class constructors way, prefer to use Property Initializers (first class support in TypeScript).
768768
```tsx
769769
class MyComponent extends React.Component<Props, State> {
770770
// default props using Property Initializers
@@ -782,7 +782,7 @@ class MyComponent extends React.Component<Props, State> {
782782
```
783783
784784
### - how to best declare component handler functions?
785-
> Don't use old-school class methods and function bind way, prefer to use Class Fields with arrow functions (first class support in TypeScript)
785+
> Don't use old-school class methods and function bind way, prefer to use Class Fields with arrow functions (first class support in TypeScript)
786786
```tsx
787787
class MyComponent extends React.Component<Props, State> {
788788
// handlers using Class Fields with arrow functions

0 commit comments

Comments
 (0)