babel-preset-proposal-typescript

Yet another Babel preset for TypeScript, only transforms proposals which TypeScript does not support now.

So that you can use babel to transform proposals which are current in stage 0-2 and TypeScript team will not implement them temporarily.

TOC

• Enabled proposal plugins
• Install
• Options
• Usage
  • Via .babelrc (Recommended)
  • Via CLI
  • Via Node API
  • Via webpack
• Changelog
• License

Enabled proposal plugins

1. async-do-expressions
2. class-properties
3. class-static-block
4. do-expressions
5. function-bind
6. function-sent
7. json-strings
8. partial-application
9. pipeline-operator
10. private-property-in-object
11. record-and-tuple
12. throw-expressions
13. v8intrinsic - Further Detail

Install

# yarn yarn add -D babel-preset-proposal-typescript # npm npm i -D babel-preset-proposal-typescript

Options

option	description	defaults
classLoose	whether to use loose mode for class-static-block, class-properties and private-methods	undefined
decoratorsBeforeExport	See Babel Document	undefined
decoratorsLegacy	whether to use legacy decorators semantic	true
isTSX	whether to enable jsx plugin with typescript	false, but true for /\.[jt]sx$/
pipelineOperator	implementation of pipeline operator, minimal, smart or fsharp	minimal
recordTuplePolyfill	whether to enable import record-tuple plugin and polyfill, or specific the polyfill module name	true for Node>=14.6, it represents @bloomberg/record-tuple-polyfill
recordTupleSyntaxType	record-tuple syntax, hash or bar	hash

Usage

Note that unlike plugins, the presets are applied in an order of last to first (https://babeljs.io/docs/en/presets/#preset-ordering), so please make sure proposal-typescript is used at the last.

Via .babelrc (Recommended)

.babelrc

{ "presets": ["proposal-typescript"] }

Via CLI

babel input.ts --presets proposal-typescript >output.ts

Via Node API

require('@babel/core').transform('code', { presets: ['proposal-typescript'], })

Via webpack

Pipe codes through babel-loader.

loader = { test: /\.[jt]sx?$/, loader: 'babel-loader', options: { presets: ['@babel/typescript', 'proposal-typescript'], }, } // if you prefer `ts-loader` or `awesome-typescript-loader` loader = { test: /\.tsx?$/, use: [ { loader: 'ts-loader', }, { loader: 'babel-loader', options: { presets: ['proposal-typescript'], }, }, ], }

Changelog

Detailed changes for each release are documented in CHANGELOG.md.

License

MIT © JounQin@1stG.me