1978 views
createJSのインストール
npm install --save @types/createjs
でインストールできる。
サンプル
まずはcreateJSを使って丸を書くサンプルプログラム。
class View {
private stage:createjs.Stage;
constructor(){
this.stage = new createjs.Stage("view");
let circle = new createjs.Shape();
circle.graphics.beginFill("red").drawCircle(0, 0, 40);
circle.x = circle.y = 50;
this.stage.addChild(circle);
this.stage.update();
console.log("aaa");
}
}
new View();
これをtscコマンドでビルドする。
ビルドした結果はoutput/view.jsに吐く設定にしている。
次に表示用のindex.htmlのサンプル。
<html>
<canvas id="view" width="480" height="640"></canvas>
<script src="https://code.createjs.com/easeljs-0.8.2.min.js"></script>
<script src="./bundle.js"></script>
</html>
問題は、3行目。npm install --save @types/createjsでcreatejsをインストールしているが、
ブラウザで動かすときには、createjsは入っていない。
結局CDNでcreatejsを取り込まないと、ブラウザでは動かないので記述している。
今回はview.jsしかないが、今後ファイルが増えることも考慮して、複数のjsファイルを以下のコマンドでbundle.jsにまとめて、
htmlから呼び出している。
browserify output/view.js -o output/bundle.js
Page 12 of 12.
[添付ファイル]
お問い合わせ
すぺぺぺ
自己紹介
本サイトの作成者。
プログラムは趣味と勉強を兼ねて、のんびり本サイトを作っています。
フレームワークはdjango。
ChatGPTで自動プログラム作成に取り組み中。
サイト/ブログ
https://www.osumoi-stdio.com/novel/
