Skip to content

Commit 6715bfb

Browse files
committed
updated docs:
- new section: Setup - added Jest config
1 parent ed668e8 commit 6715bfb

File tree

7 files changed

+65
-16
lines changed

7 files changed

+65
-16
lines changed

CHANGELOG.md

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
## 2016-12-20
2+
> FIRST COMMIT
3+
4+
## 2017-10-27
5+
> STARTED CHANGELOG
6+
- added improved "redux" types, from redux's `next` branch (check in the new [Setup](#setup) section)
7+
- added new section: Setup
8+
- added Jest config

docs/markdown/0_setup.md

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
# Setup
2+
3+
## Installing types
4+
```
5+
npm i -D @types/react @types/react-dom @types/react-redux
6+
```
7+
8+
"react" - `@types/react`
9+
"react-dom" - `@types/react-dom`
10+
"redux" - (included in npm package)*
11+
"react-redux" - `@types/react-redux`
12+
13+
> *There are improved redux types on a `next` branch in the official redux github repo, use below instructions to add it to your project:
14+
- in `package.json > devDependencies` add:
15+
`"redux-next": "reactjs/redux#next"`
16+
- in `tsconfig.json > compilerOptions > paths` add:
17+
`"redux": ["node_modules/redux-next"]`

docs/markdown/4_extras.md

+33-2
Original file line numberDiff line numberDiff line change
@@ -54,13 +54,13 @@
5454
```
5555

5656
### tslint.json
57-
> - Recommended setup is to extend build-in preset `tslint:latest` (for all rules use `tslint:all`)
57+
> - Recommended setup is to extend build-in preset `tslint:recommended` (for all rules use `tslint:all`)
5858
> - Add tslint react rules: `npm i -D tslint-react` https://github.com/palantir/tslint-react
5959
> - Amended some extended defaults for more flexibility
6060
6161
```json
6262
{
63-
"extends": ["tslint:latest", "tslint-react"],
63+
"extends": ["tslint:recommended", "tslint-react"],
6464
"rules": {
6565
"arrow-parens": false,
6666
"arrow-return-shorthand": [false],
@@ -75,11 +75,13 @@
7575
"newline-before-return": false,
7676
"no-any": false,
7777
"no-empty-interface": false,
78+
"no-import-side-effect": [true],
7879
"no-inferrable-types": [true, "ignore-params", "ignore-properties"],
7980
"no-invalid-this": [true, "check-function-in-method"],
8081
"no-null-keyword": false,
8182
"no-require-imports": false,
8283
"no-switch-case-fall-through": true,
84+
"no-submodule-imports": [true, "rxjs", "@src"],
8385
"no-trailing-whitespace": true,
8486
"no-this-assignment": [true, {
8587
"allow-destructuring": true
@@ -101,6 +103,35 @@
101103
}
102104
```
103105

106+
### jest.config.json
107+
> - Recommended setup for Jest with TypeScript
108+
> - Install with `npm i -D jest-cli ts-jest`
109+
110+
```json
111+
{
112+
"verbose": true,
113+
"transform": {
114+
".(ts|tsx)": "./node_modules/ts-jest/preprocessor.js"
115+
},
116+
"testRegex": "(/spec/.*|\\.(test|spec))\\.(ts|tsx|js)$",
117+
"moduleFileExtensions": [
118+
"ts",
119+
"tsx",
120+
"js"
121+
],
122+
"globals": {
123+
"window": {},
124+
"ts-jest": {
125+
"tsConfigFile": "./tsconfig.json"
126+
}
127+
},
128+
"setupFiles": [
129+
"./jest.stubs.js",
130+
"./src/rxjs-imports.tsx"
131+
]
132+
}
133+
```
134+
104135
### Default and Named Module Exports
105136
> Most flexible solution is to use module folder pattern, because you can leverage both named and default import when you see fit.
106137
Using this solution you'll achieve better encapsulation for internal structure/naming refactoring without breaking your consumer code:

docs/markdown/5_faq.md

-8
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,5 @@
11
# FAQ
22

3-
### - how to install react & redux types?
4-
```
5-
// react
6-
npm i -D @types/react @types/react-dom @types/react-redux
7-
8-
// redux has types included in it's npm package - don't install from @types
9-
```
10-
113
### - should I still use React.PropTypes in TS?
124
> No. When using TypeScript it is an unnecessary overhead, when declaring IProps and IState interfaces, you will get complete intellisense and compile-time safety with static type checking, this way you'll be safe from runtime errors and you will save a lot of time on debugging. Additional benefit is an elegant and standarized method of documenting your component external API in the source code.
135

docs/markdown/_intro.md

+4-4
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@ This guide is about **_"How to write type declarations to only the minimum neces
44

55
> found it usefull, want some more? [give it a :star:](https://github.com/piotrwitek/react-redux-typescript-patterns/stargazers)
66
7-
#### Announcements
8-
- All the examples ported to TypeScript v2.5 and using recent type definitions for `react` & `redux` [TypeScript Changelog](https://github.com/Microsoft/TypeScript/wiki/Roadmap)
9-
- create more strict type definitions for redux
7+
### [> Changelog](/blob/master/CHANGELOG.md)
8+
9+
### Roadmap
1010
- extend HOC section with more advanced examples [#5](/issues/5)
11-
- investigate typing patterns for component children [#7](/issues/7)
11+
- investigate typing patterns for generic component children [#7](/issues/7)
1212

1313
### Introduction
1414
This guide is aimed to use [`--strict`](https://www.typescriptlang.org/docs/handbook/compiler-options.html) flag of TypeScript compiler to provide the best static-typing experience.

docs/markdown/_toc.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
### Table of Contents
2+
- [Setup](#setup)
23
- [React](#react)
34
- [Stateless Components - SFC](#stateless-components---sfc)
45
- [Stateful Components - Class](#stateful-components---class)
@@ -13,11 +14,10 @@
1314
- [Ecosystem](#ecosystem)
1415
- [Async Flow with "redux-observable"](#async-flow-with-redux-observable)
1516
- [Selectors with "reselect"](#selectors-with-reselect)
16-
- Forms with "formstate" WIP
17-
- Styles with "typestyle" WIP
1817
- [Extras](#extras)
1918
- [tsconfig.json](#tsconfigjson)
2019
- [tslint.json](#tslintjson)
20+
- [jest.config.json](#jestconfigjson)
2121
- [Default and Named Module Exports](#default-and-named-module-exports)
2222
- [Vendor Types Augmentation](#vendor-types-augmentation)
2323
- [FAQ](#faq)

generator/src/generate-readme.ts

+1
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ const DOCS_PATH = TOP_LEVEL_PATH + 'docs/markdown/'
77
const inputFiles = [
88
DOCS_PATH + '_intro.md',
99
DOCS_PATH + '_toc.md',
10+
DOCS_PATH + '0_setup.md',
1011
DOCS_PATH + '1_react.md',
1112
DOCS_PATH + '2_redux.md',
1213
DOCS_PATH + '3_ecosystem.md',

0 commit comments

Comments
 (0)