kintone開発環境構築手順
この手順書では、esbuildとTypeScriptを使ったkintoneの開発環境構築手順について説明しています。
kintoneのカスタマイズを容易にするために、URL指定でローカルファイルを参照することで、更新を即座に反映できるようにしています。URLはHTTPSである必要があるため、mkcertでローカル用の証明書を生成しています。クラス名が被るのを防ぐためにCSS Moduleも利用できます。
開発環境の雛形をgit cloneする
git clone https://github.com/ryokdy/kintone-local-https.git
cd kintone-local-https
ライブラリのインストール
npm install
証明書を生成する
certフォルダに、localhot.pemとlocalhost-key.pemのふたつのファイルを生成します。
cd cert
mkcert --key-file localhost-key.pem --cert-file localhost.pem localhost 127.0.0.1
デバッグする
npm run dev
実行すると、dist/devフォルダにファイルが生成されます。kintoneの「アプリの設定」>「JavaScript / CSSでカスタマイズ」を開いて、生成されたJavaScriptファイルとCSSファイルのURLを指定します。
JavaScriptファイル | https://localhost:8080/dist/dev/desktop.js |
CSSファイル | https://localhost:8080/dist/dev/desktop.css |
ビルドする
npm run build
本番環境のファイルをprodフォルダに出力します。
最終更新: