DEV Community

loading...
Cover image for Typescript Without Compilation

Typescript Without Compilation

shadowtime2000 profile image shadowtime2000 Originally published at h.shadowtime2000.com ・1 min read

Typescript Without Compilation

Hi, in this post I will show how to use Typescript with static typings without needing a build step. I have also implemented this in my project SwordCSS.

Installation

We still need to install and configure Typescript though.

$ npm install -D typescript
Enter fullscreen mode Exit fullscreen mode

tsconfig.json:

{
  "compilerOptions": {
    "moduleResolution": "node",
    "module": "CommonJS",
    "target": "ESNext",
    "sourceMap": false,
    "declaration": false,
    "checkJs": true,
    "allowJs": true
  }
}
Enter fullscreen mode Exit fullscreen mode

You can change the options however you want, but make sure the last four compilerOptions are the same.

JSDoc

Now, let me give you an introduction to JSDoc. JSDoc is a format for commenting on and annotating Javascript code. Here is how you would use it with Typescript:

//@ts-check
/*
 * @function
 * @param {string} param1
 * @param {number} param2
*/
function doingSomething(param1, param2) {
    doSomething(param1, param2)
}
Enter fullscreen mode Exit fullscreen mode

Or at least that is how you would use it with functions. There are some other things you can do, and you can look at what is supported with JSDoc + Typescript.

IMPORTANT You must have //@ts-check at the top of your file for it to be type checked.

Discussion (3)

pic
Editor guide
Collapse
devhypercoder profile image
DevHyperCoder

why would someone write JSDocs while they have TypeScript? why would you not want a build step? if it is a script issue, then you can use concurrently

Collapse
shadowtime2000 profile image
shadowtime2000 Author

People may not want a build step because they don't want complexity which may be unnecessary for their project but they still want to statically type it.

Collapse
cyberhck profile image
Nishchal Gautam

I was expecting a browser based compilation step, this post was disappointing