1. Add TSC
In tsconfig.json
:
{
"compilerOptions": {
"allowJs": true
}
}
Now we can use TSC to compile JavaScript. TypeScript won’t typecheck the existing JavaScript code, but it will transpile it.
2a. Enable typechecking for JavaScript(optional)
Enable this in tsconfig.json
:
{
"compilerOptions": {
"allowJs": true,
"checkJS": true
}
}
Now whenever TS compiles a JS file it’ll do its best to infer types and typecheck as it goes.
enable checkJS
may report too many type errors at once, we can:
- turn
checkJS
off, and instead enable checking for an individual Javascript file at a time by add the// @ts-check
directive (a regular comment at the top of the file). - keep
checkJS
on, add the// @ts-nocheck
directive to those files that we don’t want to fix now.
2b. Add JSDoc Annotations (optional)
JSDoc are funny looking comments above some Javascript and Typescript code with @-annotations
like @param
, @returns
, and so do. TS understands JSDoc and uses it as input to its typechecker the same way that it uses explicit type annotations in TS code:
/**
* @param word {string} An input string to convert
* @returns {string} The string in PAscalCase
*/
export function toPascalCase(word){
return ...;
}
3. Rename files to .ts
4. Make it strict
Fix all type-related errors and disable TSC’s JS interoperability flags:
{
"compilerOptions": {
"allowJs": false,
"checkJS": false
}
}