rtorr.com

Typescript without Typescript

May 11, 2019

Typescript is fantastic. It will never be as sound as something like elm or haskell, but it is what it is, and you should probably use it. The benifits of typescript itself can be read across the internet. This post isn’t the first or last to talk about typescript. What this post aims to achive is showing how you can use typescript without having to fully commit to writing typescript yourself.

Althought there are great projects like parcel and tsdx, setting up new (or even worse) or already-in-production apps to use typescript is not exactly easy. It takes time. Lots of confusing time.

Typescript is fantastic. It will never be as sound as something like elm or Haskell, but it is what it is, and you should probably use it. The benefits of typescript itself can be read across the internet. This post isn’t the first or last to talk about typescript. What this post aims to achieve is showing how you can use typescript without having to fully commit to writing typescript yourself.

Although there are great projects like parcel and tsdx, setting up new (or even worse) or already-in-production apps to use typescript is not exactly easy. It takes time. Lots of confusing time.

Setup

cd your-project #(or make new project)
npm init
npm install typescript --save-dev
npx tsc --init

Check out the options in the tsconfig.json file to get an understanding of the options.

After looking over tsconfig.json, make it look like this

{
  "compilerOptions": {
    "allowJs": true,
    "checkJs": true,
    "strict": true
  }
}

Create index.js

touch index.js

Add some code to index.js

function sumTwo(a, b) {
  return a + b
}

Now, if you’re already using vscode, you will see where this is headed.

Run

npx tsc --noEmit

and you should see something like

λ npx tsc --noEmit
src/index.js:1:17 - error TS7006: Parameter 'a' implicitly has an 'any' type.

1 function sumTwo(a, b) {
                  ~

src/index.js:1:20 - error TS7006: Parameter 'b' implicitly has an 'any' type.

1 function sumTwo(a, b) {

Closing

As you can see, without even having to fully invest in Typescript, you can still use it’s compiler to help typecheck your code.

In future posts I want to also show:

  • How you can interop with libraries
  • How you can add types to your javascript files
  • Why you might not need babel anymore
  • Awesome integration with vscode

Richard Torruellas

Written by me, Richard Torruellas. Follow me on twitter @richardiii