Category: TypeScript

Sometimes, we want to install and run TypeScript locally in npm.

In this article, we’ll look at how to install and run TypeScript locally in npm.

How to install and run TypeScript locally in npm?

To install and run TypeScript locally in npm, we can install the typescript package as a dev dependency.

To install it, we run

npm i typescript --save-dev

Then we can add the tsc script into package.json with

{
  "name": "foo",
  "scripts": {
    "tsc": "tsc"
  },
  //...
}

And then we can run npm run tsc to run tsc in our project.

Conclusion

To install and run TypeScript locally in npm, we can install the typescript package as a dev dependency.

Sometimes, we want to fix the "index.d.ts is not a module" error when importing the webrtc module with TypeScript.

In this article, we’ll look at how to fix the "index.d.ts is not a module" error when importing the webrtc module with TypeScript.

How to fix the "index.d.ts is not a module" error when importing the webrtc module with TypeScript?

To fix the "index.d.ts is not a module" error when importing the webrtc module with TypeScript, we can set the types property in tsconfig.json to ["webrtc"].

To do this, we write

{
  "compilerOptions": {
    "target": "es5",
    "sourceMap": true,
    "noImplicitAny": true,

    "types": ["webrtc"]
  },
  "exclude": ["node_modules"]
}

in tsconfig.json.

We add the types property in the compilerOptions object property.

Then we can use webrtc without importing it in our project files since this will let the TypeScript compiler know that the webrtc members are available globally.

Conclusion

To fix the "index.d.ts is not a module" error when importing the webrtc module with TypeScript, we can set the types property in tsconfig.json to ["webrtc"].

Sometimes, we want to read and write a text file in TypeScript.

In this article, we’ll look at how to read and write a text file in TypeScript.

How to read and write a text file in TypeScript?

To read and write a text file in TypeScript, we should install the @types/node package to add the typings for core Node modules.

To install it, we run

npm i @types/node

to add the node.d.ts file into our project which has the typings for the core Node modules.

Then we can us the fs.readFileSync method to read a file by writing

import * as fs from "fs";
const f = fs.readFileSync("foo.txt", "utf8");

to call readFileSync with the path of the file and the encoding of the file to return the file.

Conclusion

To read and write a text file in TypeScript, we should install the @types/node package to add the typings for core Node modules.

Sometimes, we want to fix the ‘React.SFC is now deprecated’ warning with React and TypeScript.

In this article, we’ll look at how to fix the ‘React.SFC is now deprecated’ warning with React and TypeScript.

How to fix the ‘React.SFC is now deprecated’ warning with React and TypeScript?

To fix the ‘React.SFC is now deprecated’ warning with React and TypeScript, we should replace with React.FunctionComponent or React.FC.

For instance, we write

const Example: React.FunctionComponent<IExample> = ({ propsType }) => {
  //...
};

to create the Example component of type React.FunctionComponent<IExample> where IExample is an interface with the props’ types.

We can shorten that to

const Example: React.FC<IExample> = ({ propsType }) => {
  //...
};

Conclusion

To fix the ‘React.SFC is now deprecated’ warning with React and TypeScript, we should replace with React.FunctionComponent or React.FC.

Sometimes, we want to lint an entire folder using TypeScript TSLint.

In this article, we’ll look at how to lint an entire folder using TypeScript TSLint.

How to lint an entire folder using TypeScript TSLint?

To lint an entire folder using TypeScript TSLint, we can run tslint with the pattern of the path of the files that we want to lint.

For instance, we run

tslint src/**/*.ts{,x}

to lint all ts and tsx files in any folder in the src folder or its subfolders with tsline.

Conclusion

To lint an entire folder using TypeScript TSLint, we can run tslint with the pattern of the path of the files that we want to lint.