@builder.io/ts-transform-optional-chaining

ts-transform-optional-chaining

A TypeScript custom transformer that enables optional chaining (aka existential operator, safe navigation) support in TypeScript via the non-null assertion operator.

Usage

With this plugin

foo!.bar!.baz

compiles to

foo && foo.bar && foo.bar.baz

so you can get that madness out of your code!

Requirement

TypeScript >= 2.4.1

How to use the custom transformer

Unfortunately, TypeScript itself does not currently provide any easy way to use custom transformers (See https://github.com/Microsoft/TypeScript/issues/14419). The followings are the example usage of the custom transformer.

webpack (with ts-loader or awesome-typescript-loader)

// webpack.config.js
const optionalChainingTransformer = require('@builder.io/ts-transform-optional-chaining/transformer').default;

module.exports = {
  // ...
  module: {
    rules: [
      {
        test: /\.ts$/,
        loader: 'ts-loader', // or 'awesome-typescript-loader'
        options: {
          getCustomTransformers: program => ({
              before: [
                  optionalChainingTransformer(program)
              ]
          })
        }
      }
    ]
  }
};

Rollup (with rollup-plugin-typescript2)

// rollup.config.js
import typescript from 'rollup-plugin-typescript2';
import optionalChainingTransformer from '@builder.io/ts-transform-optional-chaining/transformer';

export default {
  // ...
  plugins: [
    typescript({ transformers: [service => ({
      before: [ optionalChainingTransformer(service.getProgram()) ],
      after: []
    })] })
  ]
};

ttypescript

See ttypescript's README for how to use this with module bundlers such as webpack or Rollup.

// tsconfig.json
{
  "compilerOptions": {
    // ...
    "plugins": [
      { "transform": "@builder.io/ts-transform-optional-chaining/transformer" }
    ]
  },
  // ...
}

TypeScript API

See test for detail. You can try it with $ npm test.

const ts = require('typescript');
const optionalChainingTransformer = require('@builder.io/ts-transform-optional-chaining/transformer').default;

const program = ts.createProgram([/* your files to compile */], {
  strict: true,
  noEmitOnError: true,
  target: ts.ScriptTarget.ES5
});

const transformers = {
  before: [optionalChainingTransformer(program)],
  after: []
};
const { emitSkipped, diagnostics } = program.emit(undefined, undefined, undefined, false, transformers);

if (emitSkipped) {
  throw new Error(diagnostics.map(diagnostic => diagnostic.messageText).join('\n'));
}

License

MIT