ブログ

以前、「Vue3をrollupでバンドルする」の記事でVue3をrollupでバンドルする手順を説明しました。その時はTypeScriptは使わずJavaScriptだけでしたが、今回は一部コンポーネントをTypeScript化したので、TypeScriptのSFC(Single File Component)をrollupでバンドルする方法を説明したいと思います。

最近、電子カタログ/漫画ビューアのWebアプリケーションで使っていたVue2をVue3に切り替える作業をしていました。また、今までは<script>タグで読み込んでいたので、ついでにバンドルするように修正しました。

Vue.jsの単一ファイルコンポーネントをrollupでバンドルして利用する例です。

Webブラウザ上でデザイン作業を可能にするJavaScriptライブラリdraggable.jsのスマートフォン対応版デモを作成しました。