Babel
  • Docs
  • Setup
  • Try it out
  • Videos
  • Blog
  • Donate
  • Team
  • GitHub

›Presets

Guides

  • What is Babel?
  • Usage Guide
  • Configure Babel
  • Learn ES2015
  • Upgrade to Babel 7
  • Upgrade to Babel 7 (API)

General

  • Editors
  • Plugins
  • Presets
  • Caveats
  • FAQ
  • Roadmap

Usage

  • Options
  • Config Files
  • cli
  • polyfill
  • transform-runtime
  • register

Presets

  • env
  • flow
  • react
  • typescript

Tooling

  • parser
  • core
  • generator
  • code-frame
  • helpers
  • runtime
  • template
  • traverse
  • types
Edit

@babel/preset-typescript

This preset is recommended if you use TypeScript, a typed superset of JavaScript. It includes the following plugins:

  • @babel/plugin-transform-typescript

You will need to specify --extensions ".ts" for @babel/cli & @babel/node cli's to handle .ts files.

Example

In

const x: number = 0;

Out

const x = 0;

Installation

npm install --save-dev @babel/preset-typescript

Usage

With a configuration file (Recommended)

{
  "presets": ["@babel/preset-typescript"]
}

Via CLI

babel --presets @babel/preset-typescript script.ts

Via Node API

require("@babel/core").transform("code", {
  presets: ["@babel/preset-typescript"],
});

Options

isTSX

boolean, defaults to false

Forcibly enables jsx parsing. Otherwise angle brackets will be treated as typescript's legacy type assertion var foo = <string>bar;. Also, isTSX: true requires allExtensions: true.

jsxPragma

string, defaults to React

Replace the function used when compiling JSX expressions. This is so that we know that the import is not a type import, and should not be removed.

allExtensions

boolean, defaults to false

Indicates that every file should be parsed as TS or TSX (depending on the isTSX option).

allowNamespaces

boolean, uses the default set by @babel/plugin-transform-typescript.

Added in: v7.6.0

Enables compilation of TypeScript namespaces.

allowDeclareFields

boolean, defaults to false

Added in: v7.7.0

NOTE: This will be enabled by default in Babel 8

When enabled, type-only class fields are only removed if they are prefixed with the declare modifier:

class A {
  declare foo: string; // Removed
  bar: string; // Initialized to undefined
  prop?: string; // Initialized to undefined
  prop1!: string // Initialized to undefined
}

onlyRemoveTypeImports

boolean, defaults to false

Added in: v7.9.0

When set to true, the transform will only remove type-only imports (introduced in TypeScript 3.8). This should only be used if you are using TypeScript >= 3.8.

You can read more about configuring preset options here.

← reactparser →
  • Example
  • Installation
  • Usage
    • With a configuration file (Recommended)
    • Via CLI
    • Via Node API
  • Options
    • isTSX
    • jsxPragma
    • allExtensions
    • allowNamespaces
    • allowDeclareFields
    • onlyRemoveTypeImports
Babel
Docs
Learn ES2015
Community
VideosUser ShowcaseStack OverflowSlack ChannelTwitter
More
BlogGitHub OrgGitHub RepoWebsite RepoOld 6.x SiteOld 5.x Site