ITエンジニア/デザイナ向けにオープンソースを毎日紹介

最近はWebアプリケーション化の流れが活発なので、ちょっとした小さいツールであればHTML/JavaScriptで作ってしまえるでしょう。そういったツールを作るのは簡単ですが、配布が意外と面倒です。

HTML/JavaScript/スタイルシート/画像などをZipで固めて配布…というのはあまりかっこうよくありません。そこで使ってみたいのがhtml-inlineです。

html-inlineの使い方

html-inlineのインストールはnpmで簡単にできます。

npm install -g html-inline

例えば次のようなファイルがあるとします。

$ cat index.html 
<html>
  <head>
    <link rel="stylesheet" href="/yo.css">
  </link></head>
  <body>
    <img src="icon.png"/>
    <script src="hey.js"></script>
  </body>
</html>

これに対してhtml-inlineコマンドを実行します。

$ html-inline index.html > pack.html

できあがったpack.htmlを開いてみます。

一つのHTMLファイル内に画像、JavaScript、スタイルシートが入っています。
一つのHTMLファイル内に画像、JavaScript、スタイルシートが入っています。

ソースを見るとよく分かります。
ソースを見るとよく分かります。

html-inlineでパックすれば、後はHTMLファイルだけを配布すればよくなります。Web技術で作ったアプリケーションを広めるのにぴったりなソフトウェアではないでしょうか。

html-inlineはnode/JavaScript製、MIT Licenseのオープンソース・ソフトウェアです。

substack/html-inline

 

MOONGIFTの関連記事

コメント

  • DevRel
  • Com2