hydrotik / node-hapi-react-redux-sass-typescript-mongo-webpack-hmr-gulp

Rapid prototyping full stack framework using our favorite technologies. Inspired by Aqua/Frame with a sprinkle of Mean.io and Mean.js
11 stars 4 forks source link

Upgrade Typings to 1.0+ #239

Closed ghost closed 8 years ago

ghost commented 8 years ago

Changes made

Moved custom typescript definitions to a repo

I moved our custom typescript definitions to a repo at https://github.com/dhsaks/typescript-definitions

Removed js and jsx from resolve rule in Webpack. Fixed broken source files

This caused a bunch of compiler complaints about not being able to resolve lodash and Promise...which actually made sense since the source files didn't actually import either. The real mystery is why lodash and Promise resolved before...babel?

Anyway, I went through the source files and added imports for es6-promise and lodash

Typescript definitions for react-redux are challenging

Turns out there are some issues using the connect function/decorator in a way that will pass type checking. The solution was basically to convert using connect as a decorator:

@connect(mapStateToProps, mapDispatchToProps)
export class MyContainer<BaseProps, any> {

to using it as a regular function:

export const MyExport = connect(mapStateToProps, mapDispatchToProps)(MyContainer);

Also, mapStateToProps and mapDispatchToProps needed to have some types added to them for Typescript to infer the proper form of connect.

Ambient definitions are now Global definitions

The folder structure of typings has changed. So, it's all the more reason to get the standard typings install flow working. Just typings install.

Why?

The main benefit is that moving forward, we'll have a simple process for installing and updating type definitions. We can install all definitions using typings install. We don't even need typings folder in source-control.

The Steps to Update

  1. Fetch branch feature/upgrade-typings-1.0
  2. Upgrade your version of typings to latest 1.0.x: npm install -g typings
  3. Delete your current typings folder
  4. Run: typings install
  5. Run the project

    Only one pesky thing left...

All the /// <reference path='../typings/main.d.ts' /> lines in the source files. They point to a file called main.d.ts. The correct file is index.d.ts as generated by typings install.

So...find-replace all files to point to typings/index.d.ts

ghost commented 8 years ago

Done