GitHubからスクリプトを読み込んでnippで実行する

経緯

nippは便利なのだが、一度URLを公開した後にスクリプトを修正すると再度URLを公開しないといけないのが面倒なときがある。

そこでgithubに置いたスクリプトを読み込んでnippにロードする仕組みを作った。(ほとんどnipp作者の @nwtgck さんが作ってくれた)

使い方

で、そのロード用のURLを作るためのnippを作った。例によってawesome-nippに置いてあるが、

感想

スクリプトGitHubから読み込んでnipp上に展開するためにES2017を使っているのだが、

Opal.load('opal');
Opal.load('opal-parser');
(async ()=>{
  const gh = location.search.split("?")[1].split("=")[1];

  const res = await fetch(`https://raw.githubusercontent.com/${gh}`);
  const rbScript = await res.text();

 const e = document.querySelector("textarea[ng-model='inputText']");
  const $scope = angular.element(e).scope();
  $scope.script = await rbScript;
  $scope.transpiler = RubyTranspiler;
  $scope.enablePromiseWait = false;
  $scope.enableClickRun = false;
  $scope.enablePromiseWait = false;
  $scope.setLocationHash();
  $scope.transpile();
})();

こんな短いコードで書けて感動した。async await の便利さがよく分かった。