npmパッケージをローカルにダウンロードする方法

プログラミング

npmで公開されているパッケージは、UNPKGで公開されています。
UNPKGで公開されているパッケージをscriptタグ等で指定することで、ローカルにライブラリを落とすことなくライブラリを使用することができるようになります。
インターネット接続していることが前提となりますが、Webアプリケーションでは便利なサービスです。
(このようなサービスをCDNサービスと呼びます)

以前に試したVue.jsも、インストールすることなく以下のような形で使用することができます。
(今回は触れませんが、バージョン指定も可能です)

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>Vue.js - Hello world!</title>
</head>
<body>

<div id="app">
  <input type="checkbox" id="checkbox1" v-model="checked1">
  <label for="checkbox1">
    {{ message }}
  </label>
</div>

<script src="https://unpkg.com/vue"></script>
<script>
  var app = new Vue({
    // elで指定した値はdivタグのidと対応
    el: '#app',
    // 変数の初期値定義
    data: {
      message: '',
      checked1: false
    },
    // 変数の値を監視するイベントを定義
    watch: {
      checked1: function(newVal, oldVal) {
        this.message = (newVal) ? 'Hello World!' : '';
      }
    }
  })
</script>
</body>
</html>

いかがでしたでしょうか。

ライブラリを使用することで短期間で高品質のWebアプリケーションを作ることができますが、資産管理の煩雑さが一つの問題となります。
CDNサービスの利用はその問題への解決法となり得ます。

私も、煩雑な資産管理に苦しめられてきた経験(プログラムが動かなかったり、管理表が必要になったり)があるので、CDNサービスを始めて知った時には感動しました。

コメント

タイトルとURLをコピーしました