7 February

Casting

SO answer

const x = <any> foo;
// is equivalent to:
const x = foo as any;
// but avoids conficts with JSX

Convert Map<K, V> keys to an array

SO answer

const m = new Map();
const keys = Array.from(m.keys());

6 February

Adding Typescript support

Add new dependency: typescript

devDependencies for types (although watch for versions!):

{
  "@types/jest": "^23.3.9",
  "@types/lodash.get": "^4.4.4",
  "@types/lodash.isempty": "^4.4.4",
  "@types/node": "^10.12.9",
  "@types/react": "^16.7.6",
  "@types/react-dom": "^16.0.9",
  "@types/react-redux": "^6.0.9",
  "@types/react-router": "^4.4.1",
  "@types/react-router-dom": "^4.3.1",
}

tsconfig.json enables Typescript support:

{
	"compilerOptions": {
		"target": "es5",
		"allowJs": true,
		"baseUrl": "./src",
		"skipLibCheck": false,
		"esModuleInterop": true,
		"allowSyntheticDefaultImports": true,
		"strict": true, // can be commented for ignoring 'any' errors
		"forceConsistentCasingInFileNames": true,
		"module": "esnext",
		"moduleResolution": "node",
		"resolveJsonModule": true,
		"isolatedModules": true,
		"noEmit": true,
		"jsx": "preserve",
		"lib": ["es2018", "dom"]
	},
	"include": ["src"],
	"exclude": ["build"]
}

src/global.d.ts for Sass modules support (SO):

declare module '*.scss' {
  const content: {[className: string]: string};
  export = content;
}

5 February

Component re-renders instead of remounting on path change in react-router

SO answer

// entry in react-router-config
{
  path: '/foo/:bar/baz',
  exact: true,
  render: props => (<Component key={props.match.params.bar} {...props} />)
}