kintone の帳票(PDF)を、日本語の要件を伝えるだけで AI に作らせる環境を公開しました。
アプリ 3740(見積書)に、A4 縦 2 ページの「ご提案書」ボタンを作って。
1 ページ目は表紙(中央に「ご提案書」、宛名(御中)、提出日、自社名と担当者)。
2 ページ目は「ご提案内容」に備考、「お見積り概要」に見積明細の表と小計・消費税・合計。
各ページの右下にページ番号(1 / 2)。押したらプレビューを表示、PDF はダウンロード。
これだけで、AI が実アプリの項目定義と実データを確かめながら帳票の HTML・CSS・計算式を組み、印刷屋プラグインにそのまま取り込める設定 JSON を書きます。手元で帳票の見た目を確かめてから、プラグインの設定画面でアップロードして保存するだけです。
完成した PDF(表紙と本文の 2 ページ)
テンプレートリポジトリ(public): https://github.com/rex0220/print-craft-authoring
プラグイン本体の機能は 製品紹介記事 と FAQ を、帳票を設定画面で作る手順は 見積書の作成手順 を参照してください。
本記事は「AI に作らせる」環境の構築と使い方に絞ります。
仕組み
印刷屋プラグイン Ver.6 の設定は、設定画面の設定のダウンロード / アップロードで、JSON のファイルとしてまるごと受け渡しできます。テンプレートは、AI(Claude Code)がこの JSON を書くための文書と道具をそろえたものです。
ポイントは 3 つです。
- ① AI は、kintone 公式 MCP と tools でアプリの項目コードと型、実際のレコードを見てから帳票を組み、要件の言葉とフィールドコードの対応を表で示します。対応する項目が無いもの(今回は「提出日」と「自社名」)は、仮に使った項目や値を明示して、確認を求めてきます。
- ③ 設定画面が保存のときに作る値(計算式が使う項目の一覧など)を、tools が手元の印刷屋プラグインの zip の計算式エンジンで作り、設定を検査します。エラーが 0 になるまで AI が直します。
-
④ 帳票を HTML にして
out/に書き出すので、取り込む前に見た目をブラウザーで確かめられます。
生成した設定は settings/ のファイルとして残るので、git で履歴管理できます。
前提
| 項目 | 本記事の前提 |
|---|---|
| プラグイン | 印刷屋プラグイン Ver.6(製品版または試用版)。アプリに入れたものと同じ版の zip ファイルを手元に置く |
| tools / MCP |
@rex0220/print-craft-authoring-tools 1.0.0 と kintone 公式 MCP サーバー(@kintone/mcp-server)1.8.2。どちらも npm ci で入ります |
| Node.js | 20 以上 |
| エディター | VSCode + Claude Code(Claude のサブスクリプションか、Claude Console の API の従量課金。本記事はサブスクリプションで確かめました) |
| kintone アカウント | ログインユーザー認証(2 要素認証なしのアカウント。閲覧専用のアカウントがあればベスト)。ログイン名とパスワードで API を使えない環境では、対象アプリのレコード閲覧だけの API トークンを設定することもできます(テンプレートの README の手順 3。本記事はログインユーザー認証で確かめました) |
| 対象アプリ | 記事の例は見積書アプリ(アプリ番号 3740。見積明細のテーブルと、小計・消費税・合計の計算項目がある) |
本記事の手順は、Windows 11、VSCode、Claude Code 2.1.289 で確かめました。
このテンプレートでは、kintone MCP の書き込みツールを拒否し、tools の通信を GET に限っています。AI への常設指示でも kintone の変更を禁じています(「安全のしくみ」で後述)。
AI(Claude Code)が読んだ項目定義とレコードの内容は、Claude の処理に使われます。実データを使えない場合は、検証用のアプリとサンプルのデータで試してください。
環境構築(初回だけ)
1. テンプレートから自分のリポジトリを作る
テンプレートページ右上の Use this template → Create a new repository で、自分のアカウントに private で作成して clone します。
Use this template → Create a new repository を選ぶ
作成画面 — visibility を Private に切り替えて作成する
作成画面の visibility は Public が初期値です。必ず Private に切り替えてください。
設定 JSON にはアプリ番号・項目コード・業務用語が入ります。GitHub CLI なら 1 行です:
gh repo create my-print-craft-settings --template rex0220/print-craft-authoring --private --clone
2. 依存を入れる
npm ci
tools(@rex0220/print-craft-authoring-tools)と kintone 公式 MCP サーバーが入ります。本記事の確認時(2026-10)には、kintone 公式 MCP の依存(axios、qs)について npm audit の警告が出ました。
3. 接続先と zip の場所を書く
.env.example をコピーして .env を作り、接続先と印刷屋プラグインの zip の場所を書きます。
KINTONE_BASE_URL=https://<自分の環境>.cybozu.com
PCRAFT_PLUGIN_ZIP="C:\Users\you\Downloads\print-craft-plugin6.zip"
zip の場所は、エクスプローラーで zip を右クリック →「パスのコピー」で貼り付けた形のままでかまいません。tools はこの zip から計算式エンジンを読みます(tools 自体には入っていません)。
ログイン名・パスワードは OS のユーザー環境変数に置くのがおすすめです(プロジェクト内のファイルに残りません。値はユーザーの環境変数としてレジストリに保存されます)。Windows ならコマンドプロンプトで:
setx KINTONE_USERNAME "<ログイン名>"
setx KINTONE_PASSWORD "<パスワード>"
を実行して、VSCode のウィンドウをすべて閉じて起動し直します(「Reload Window」では反映されません)。反映の確認は VSCode のターミナルで $env:KINTONE_USERNAME と打ち、ログイン名が出れば OK です。
手早く試すだけなら、.env の KINTONE_USERNAME / KINTONE_PASSWORD の 2 行のコメントを外して書いても動きます(.env は git 管理外です)。
4. VSCode で開いて Claude Code を起動
手順 2・3 の後に、フォルダーを VSCode で開いて Claude Code を起動します。kintone MCP は node_modules と .env を使って起動するので、順番が逆だと MCP がつながりません(そのときはセッションを始め直します)。
Claude Code で /mcp と打ち、Project の欄に kintone が Connected と出れば OK です。
作業中に、kintone の読み取りや npx @rex0220/print-craft-authoring-tools の実行で確認が出たら、「2 Yes, allow … for this session」 を選びます。そのセッションの間は、同じ操作で聞かれなくなります。
補足: 確認を出さないようにする(任意)
テンプレートの .claude/settings.json には、kintone の読み取りと tools の実行を確認なしで通す許可が入っています。ただし、この許可は Claude Code でそのフォルダーを信頼したときだけ効きます。Windows の VSCode では、ターミナルで次のようにします。
cmd
cd /d c:\Users\you\Projects\my-print-craft-settings
claude
-
cd /dのパスは、ドライブ文字を小文字のc:で打ちます - 英語の確認が出ます。フォルダーを信頼するかの確認は、上下キーで Yes に移ってから Enter(既定は No です)。
.mcp.jsonの kintone サーバーを使うかの確認も、使うほうを選びます -
/exitで終え、exitで cmd を抜けます。この後に始めた VSCode のセッションから効きます
信頼の確認 — 上下キーで Yes に移ってから Enter
なぜ cmd か(Claude Code 2.1.289 で確かめた回避策です): VSCode は Windows でフォルダーを
c:\…(小文字)で扱い、PowerShell はC:\…(大文字)に直します。筆者の環境では、PowerShell から起動したclaudeで信頼するとC:の形で記録され、VSCode では許可が効きませんでした。PowerShell のターミナルでcmdと打っただけでもC:のままなので、cd /d c:\…が要ります(anthropics/claude-code#99828 で報告済みです)。
5. 疎通確認
VSCode のターミナルで:
npx @rex0220/print-craft-authoring-tools version
tools の版、zip から読んだ印刷屋の版、計算式エンジンの SHA-256 と「zip の中身は既知」が出れば OK です。zip の場所が違う、版が合わないときは、ここで止まります。
Claude Code にも頼みます(番号は自分のアプリ):
kintone-get-app でアプリ 3740 を見て
アプリ名が返れば準備完了です。AI の返答(抜粋):
アプリ 3740 の情報です。
項目 値 アプリ名 見積書(印刷屋) アプリコード (なし) アプリの説明によると、商品の見積書を作るアプリです。商品リストアプリとルックアップでつながっていて、型番・商品名・単価などをコピーして見積を作れます。
作らせる
事前準備(手作業)
このテンプレートでは AI に kintone を変更させないので、次は人が済ませておきます。
- 対象アプリに印刷屋プラグイン Ver.6 を追加する
- PDF を添付ファイル項目に保存するなら、その項目をアプリに作っておく(今回の例はダウンロードなので不要)
指示する
冒頭の指示文を Claude Code に貼ります。コツは 3 つです。
-
アプリは番号で指定する(アプリの URL
/k/番号/の数字)。同じ名前のアプリの取り違えを防ぎます - 用紙と向き、ボタンを押したときの動き(プレビューを表示 / 確認してから作成 / すぐに作成)、保存先(添付ファイル項目か、ダウンロードか)を伝える
- 長い要件は
requirements/にファイルで書いて、「requirements/〇〇.md の要件で作って」と頼んでもかまいません
この例は 2 ページ固定の帳票です。1 ページは用紙に固定で、明細や備考が多いとはみ出した分は切れます。明細が多くなるなら「表を複数ページに分けて」と頼んでください。最終的な PDF は、明細がいちばん多い、商品名や備考が長いレコードでも確かめてください。
すると AI は、おおむねこう動きます(全部自動です):
-
kintone-get-app— アプリを確かめる -
npx @rex0220/print-craft-authoring-tools fields --app 3740→--summary— 項目コードと型、レイアウトの順を確かめる - テンプレートの帳票レシピ集と雛形を読む
-
kintone-get-records— プレビューに使うレコードを選ぶ(明細が複数行、備考に改行があるもの) -
settings/APP3740-見積書-ご提案書.jsonに設定を書く -
npx @rex0220/print-craft-authoring-tools normalize— 派生値を作って検査する(エラーが 0 になるまで直す) -
npx @rex0220/print-craft-authoring-tools record→preview—out/ご提案書.htmlに帳票を書き出す
AI の返答
終わると、AI はこう返してきます(実際の返答。最後の「確かめ方と反映の手順」は省略):
A4 縦 2 ページの「ご提案書」ボタンを作りました。normalize はエラー 0、プレビューはレコード 3 で 2 ページ、ファイル名「ご提案書-S-0000003.pdf」です。ページ番号が「1 / 2」「2 / 2」に置き換わることも出力で確かめました。見た目はまだ確かめていないので、下の手順で見てください。
設定ファイル:
settings/APP3740-見積書-ご提案書.json要件と項目の対応
要件 使った項目・内容 宛名(御中) 宛名+「御中」提出日 見積日(「2026年2月12日」の形)自社名 固定の文字「株式会社サンプル」 担当者 担当者(ユーザー選択の表示名)ご提案内容 備考(改行はそのまま改行)見積明細の表 見積明細の #・商品名・数量・単価・金額小計・消費税・合計 小計・消費税・合計(表の右下)
- 1 ページ目(表紙): 左上に宛名、中央に「ご提案書」、右下に提出日・自社名・担当者です。
- 2 ページ目: 「ご提案内容」と「お見積り概要」の見出しの下に、それぞれ備考と明細の表、その下に小計・消費税・合計を置きました。
- ボタン: 押すとプレビューを表示し、PDF はダウンロードです(添付ファイルには保存しません)。
決めてほしい点
- 提出日: 「提出日」という項目が無いので
見積日を使いました。PDF を作った日にするならTODAY()に変えます。- 自社名: 項目が無いので、既存の見積書と同じ「株式会社サンプル」を仮に入れています。正しい社名を教えてください。
- 表の列: 既存の見積書と同じ列にしたので、
型番は入れていません。要るなら足します。- 消費税の見出し: 税率は付けず「消費税」だけにしました。
- 出す画面: 詳細画面だけにしています(
viewsCsv: "-")。注意
- 警告
formula.rawHtml:TABLE_HTMLは、明細の値(商品名など)をエスケープせずに HTML として入れます。既存の見積書と同じ使い方で、想定どおりです。- 2 ページ目の行数: 2 ページ目は 1 ページに収める作りなので、明細がおよそ 20 行を超えるとページからはみ出した分が切れます(備考が長いともっと少なくなります)。行数が多い見積があるなら、表を複数ページに分ける形に変えます。
要件の言葉に対応する項目が無いもの(提出日、自社名)は、仮に使った項目や値を明示して、確認を求めてきます。答えるときは、後述の「作った後 — 変更も AI に頼む」と同じ頼み方です。
注意の 1 つ目(TABLE_HTML)は、明細のセルの値(商品名など)がエスケープされずに HTML として入る、という意味です。tools の検査が見るのは設定の HTML と計算式で、差し込まれるレコードの値までは見ません。商品名などに < や & が入りうるなら、そういうデータでも PDF を確かめてください(印刷屋 Ver.6 は、描画の前に kintone 以外への読み込みとスクリプトを除きます)。
生成された設定
生成された設定は、たとえば表紙のページならこうなっています(HTML 欄):
<div class="rex0220-pcraft-page">
<div class="pcraft-prop-to">${ESC_HTML(宛名)} 御中</div>
<div class="pcraft-prop-title">ご提案書</div>
<div class="pcraft-prop-from">
<p>${DATE_FORMAT(見積日, "YYYY年M月D日")}</p>
<p class="pcraft-prop-company">株式会社サンプル</p>
<p>担当: ${ESC_HTML(担当者)}</p>
</div>
<div class="pcraft-page-no">#{&p} / #{&n}</div>
</div>
2 ページ目の明細の表は、計算式で目印 ##table## に差し込みます:
LET(
table, TABLE_HTML(見積明細,
OPT("pref", "pcraft-inv-item-"),
ARRAY("#", ROWNO(見積明細) + 1),
商品名, 数量, 単価, 金額
),
REPLACE($html, "##table##", table)
)
文字列の項目は ESC_HTML で囲む、ページ番号は #{&p} / #{&n} で書く、といった印刷屋の書き方は、テンプレートの帳票レシピ集と AI への常設指示(CLAUDE.md)に書いてあり、AI はそれに沿って書きます。
見た目を確かめる
out/ご提案書.html を Chrome で開きます。
近似のプレビューです(添付ファイルの画像と QR はダミーです)。最終的な見た目は、印刷屋プラグインの PDF で確かめます。
取り込む
- アプリの設定 → プラグイン → 印刷屋プラグインの 設定
-
設定をアップロード で
settings/APP3740-見積書-ご提案書.jsonを選ぶ -
取り込み方を選ぶ
- 印刷屋の設定がまだ無いアプリ → 全置換
- 既にボタンがあるアプリに足す → 追加
- 既にあるボタンを差し替える → 一部置換(ボタンごとに置き換え先を選ぶ)
- 保存する → 運用環境に反映
設定のアップロード — 取り込み方を選ぶ
取り込んだボタンに、このアプリで使えない設定(無い項目など)があると、保存のときにエラーになり保存されません。
詳細画面に「ご提案書」ボタンが出るので、押すとプレビューが表示され、PDF をダウンロードできます(冒頭の画像)。
詳細画面の「ご提案書」ボタンとプレビュー
作った後 — 変更も AI に頼む
2 回目からは「対象ファイル名 + 変更内容 + 更新して」の形で頼みます。
settings/APP3740-見積書-ご提案書.json を更新して。
自社名を「株式会社〇〇」に、明細の表に型番の列を足して。
-
変更は同じファイルへの上書きで返ってきます。AI は変更前と比べた差分(HTML / CSS / 計算式の行の差分。
npx @rex0220/print-craft-authoring-tools diff)を見せるので、確かめてから「一部置換」で取り込めます。自社名を変えたときの差分は、たとえばこうなります:ボタン ご提案書 / HTML 設定 3 行目 / html: … <div class="pcraft-prop-from"> <p>${DATE_FORMAT(見積日, "YYYY年M月D日")}</p> - <p class="pcraft-prop-company">株式会社サンプル</p> + <p class="pcraft-prop-company">株式会社〇〇</p> <p>担当: ${ESC_HTML(担当者)}</p> </div> … (派生値 formula / usedFields / id / views / pluginUOG は除く。--derived で含める) -
設定画面で直した設定を AI に直させるときは、設定画面の 設定をダウンロード で落としたファイルを
settings/に置いて頼みます
指示文の例は、テンプレートの docs/AI設定オーサリング手順.md にまとめてあります。
安全のしくみ
帳票の HTML はレコードの値と混ざってブラウザーで描かれるので、テンプレートは次のように守っています。
-
kintone への書き込みを防ぐ: Claude Code の設定(
.claude/settings.json)で kintone MCP の書き込みツールを拒否し(拒否の設定は、フォルダーを信頼していなくても効きます)、tools は GET しか送りません。AI への常設指示(CLAUDE.md)でも禁じています -
値の差し込み: 印刷屋の
${式}は値をエスケープしないので、AI は文字列の項目を${ESC_HTML(項目)}で書きます。tools の検査(normalize)は、エスケープしない差し込みや、HTML をそのまま入れる関数(TABLE_HTMLなど)を警告で知らせます。検査が見るのは設定の HTML と計算式で、差し込まれるレコードの値は見ません -
許可したものだけ: normalize は許可した要素と属性だけを通し、スクリプト、イベント属性、
javascript:の URL などはエラーで止めます。新しい設定は外部参照を「除く」にするので、印刷屋 Ver.6 が描画の前に kintone 以外への読み込みとスクリプトを除きます - zip の照合: tools は、zip の中身(計算式エンジンなど)が既知のものと一致しなければ実行しません
-
認証情報とレコードの値: AI は
.envを読みません。records/とout/にはレコードの値が入るので、git の管理外にしてあります。git に入らないことと、AI に渡らないことは別です。AI がkintone-get-recordsで見たレコードの内容は、Claude の処理に使われます
サーバー側からも書き込みを防ぎたい場合は、閲覧専用のアカウントか、レコード閲覧だけの API トークンを使ってください(テンプレートの README)。
つまずいたら
| 症状 | 確認すること |
|---|---|
/mcp に kintone が出ない、AI が kintone のツールが無いと言う |
npm ci と .env の前にセッションを始めた → 始め直す。補足の手順で kintone サーバーを使わないほうを選んだ → .claude/settings.local.json の disabledMcpjsonServers から kintone を消して始め直す(ほかの設定が無ければファイルごと消してよい。VSCode の /mcp には、無効にしたサーバーが出ません) |
Need to install the following packages と出る |
このフォルダーで npm ci をしていない。n で止め、npm ci してから実行する |
| 毎回確認が出る | 「2 Yes, allow … for this session」を選ぶか、補足の信頼の手順をする |
印刷屋の zip の場所が分からない / 版 … には対応していない
|
.env の PCRAFT_PLUGIN_ZIP のパス。Ver.6 の zip か |
KINTONE_BASE_URL が無い、認証情報が届かない |
setx の後に VSCode を完全に再起動したか(Reload Window では反映されません) |
| 401 / 権限エラー | ログイン名・パスワードの誤り。2 要素認証が有効なアカウントは使えません。そのユーザーにアプリの閲覧権限があるか |
| 2 ページ目の下が切れる | 1 ページは用紙に固定で、はみ出した分は切れます。明細が多いなら「表を複数ページに分けて」と頼む |
まとめ
- 要件は日本語、確認は実データ、見た目は HTML、成果物は git 管理の設定 JSON。 AI は実アプリの項目とレコードを確かめて設定を書き、tools が検査とプレビューをします
- テンプレートは public で公開しています。Use this template → private でどうぞ:
https://github.com/rex0220/print-craft-authoring - プラグインの機能全般は 製品紹介記事、よくある質問は FAQ へ
- 続編: rex0220 印刷屋プラグイン - AI(Claude Code)に帳票を作らせる(時計カタログ編) — 1 行の指示から始めて、AI に 3 回頼んで写真入りのカタログを作りました








