Dartをセットアップしよう (6/6)

では、残るDartスクリプトを作成しましょう。下のリスト欄に簡単なサンプルを掲載しておきます。

これも、先ほどのサンプルと同様に「hello.dart」というファイル名で保存しておくことにします。先のサンプルをそのまま書き換えて使っても構いません。これは、先ほど作成したHTMLファイルと同じ場所に保存しておいて下さい。

作成したら、これをトランスコンパイルします。これはコマンドプロンプトまたはターミナルから以下のように実行をします。

dart2js -o hello.js hello.dart

これで、hello.dartをJavaScriptのスクリプトに変換し、「hello.js」というファイル名で保存します。実際に利用するのは、このhello.jsのほうになります。

ファイルができたら、先のhello.htmlをWebブラウザで開いてみましょう。Helloというタイトルの下に「Hello Dart!」というテキストが表示されます。これが、スクリプトで表示されたテキストになります。

――とりあえず、これでスクリプトを書いて動かすまでの基本操作ができるようになりました。次回から、実際にスクリプトを実行しながらDart言語について説明していくことにしましょう。

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

import 'dart:html';

void main() {
  var msg = querySelector('#msg');
  msg.text = 'Hello Dart!';
}