skillup

技術ブログ

JavaScript

npmでのJSライブラリインストール&ビルド(※gulp使用時)

投稿日:

こちらのリンクでJSのnpmパッケージでのインストール&ビルドをしたので、gulpでのビルドを。

前提条件としては

  • nodeのインストール
  • npmのインストール

がされていればOKです。

最小構成でいうとgulp,gulp-webback,config.js(設定ファイル)が読み込めればOKです。※サンプルでは例としてjQueryを読み込んでいます。

sample_rs.js ビルドしたいjs

jQueryを読み込みオリジナルの処理をここに書きます。

config.js 設定ファイル

gulpfile.js ※ここでタスクを実行します。

下記コマンドを実行した後、上記の設定だとbuild.jsというコンパイルされたjsが作成されます。(この中にはjQueryももちろん入っています。)

sample.html コンパイルしたjsをよみこむhtml

ソース

https://github.com/umanari145/library/tree/master/resources

参考リンク

webpack初心者がJavaScriptをビルドするまでの手順

-JavaScript
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

no image

timepickerについて

日付を入力するときに直接、文字入力するのがメンドイことからカレンダーが表示されるプラグインを使っている人は多いでしょう。 私も日頃Datepickerというライブラリを使っています。が、このプラグイン …

no image

dataTableによる無限スクロール

Angularで無限スクロールをやったので一般のjqueryで。 dataTablesというプラグインです。 以前下記リンクで紹介していますが、ようわかっとらんかったんで(汗)再度書きます。 ページャ …

no image

bowerのインストール

業務でAngularJSをいじっていますが、そこでbowerというソフトウェアの存在を知りました。 Contents1 bowerとは?2 インストール方法 bowerとは? フロントエンドのパッケー …

no image

Angularでのイベント+改行+echoでのバッファサイズ変更

Contents1 Angularのイベント処理2 Angularでの改行ネタ3 echoでのバッファサイズ変換 Angularのイベント処理 Angularを使っていて楽なのはHTMLタグにインベン …

no image

Angular概論 モジュール、コントローラー、スコープなど

Contents1 Angularインストール2 ソース2.1 モジュール、スコープとコントローラ2.1.1  モジュールとは2.1.2 コントローラーとは2.1.3 スコープとは3 参考リンク An …