概要とインストール

ichigo.js（@mintjamsinc/ichigojs）は、軽量なリアクティブ UI フレームワークです。Vue ライクな API と仮想 DOM を備え、宣言的なテンプレートと自動依存追跡で UI を構築できます。

MintJams では、Webtop の標準アプリ・独自アプリ、Commerce の Storefront、タスクフォームなど、フロントエンド全般で使われています。

特長

  • リアクティブな data / computed / watch（マイクロタスクでバッチ更新）
  • 豊富なディレクティブ（v-if / v-for / v-model / v-bind / v-on ほか）
  • ライフサイクルフックと userData（外部ライブラリの保持と自動クリーンアップ）
  • defineComponent による再利用可能な Web Components（props / slot / \$emit）
  • TypeScript 完全対応・小さなバンドル

インストール

npm install @mintjamsinc/ichigojs

バンドル形式:

  • ESM — import { VDOM } from '@mintjamsinc/ichigojs';
  • CommonJS — const { VDOM } = require('@mintjamsinc/ichigojs');
  • UMD — <script src=".../dist/ichigo.umd.js"> で読み込み、window.ichigo から利用

最小の例

<div id="app">
  <h1>{{ message }}</h1>
  <input v-model="message">
  <p>Count: {{ count }}</p>
  <button @click="increment">Increment</button>
</div>

import { VDOM } from '@mintjamsinc/ichigojs';

VDOM.createApp({
  data() { return { message: 'Hello ichigo.js!', count: 0 }; },
  methods: { increment() { this.count++; } }
}).mount('#app');

次のステップ