TypeScriptでブックマークレットを書きたい。

TypeScript でブックマークレットを書くための手順。

目次

minify

https://github.com/tdewolff/minify/tree/master/cmd/minify

Go 言語製の JavaScript を縮小化する(一行にまとめる)ためのコマンドラインツール。 uglifyjs だと es5 がどうとか javascript:void の部分とか面倒なのでこれを使う。

  $ sudo apt install minify

TypeScript

  $ npm i -D typescript

TypeScript で書いたファイル

適当に TypeScript 風で書いたブックマークレットのファイル index.ts

javascript: void (() => {
  new (class {
    constructor() {
      const message: string = "Hello World";
      window.alert(message);
    }
  })();
})();

ビルド

TypeScript のトランスパイルと JavaScript の縮小化

  $ npx tsc --outFile index.js index.ts && minify -o index.min.js index.js

成果物

縮小前のファイル index.js

javascript: void (function () {
  new /** @class */ ((function () {
    function class_1() {
      var message = "Hello World";
      window.alert(message);
    }
    return class_1;
  })())();
})();

縮小後のファイル index.min.js

javascript:void((function(){new((function(){function class_1(){var message='Hello World';window.alert(message);}
return class_1;}()))();})());

何故か一行になってないことに納得がいかないけど見なかったことにする。