タグ

関連タグで絞り込む (0)

  • 関連タグはありません

タグの絞り込みを解除

JavaScriptとNode.jsとgulpに関するclavierのブックマーク (7)

  • Node.jsユーザーなら押さえておきたいnpm-scriptsのタスク実行方法まとめ - ICS MEDIA

    ウェブ制作の現場では作業の自動化を行うことが多いです。Node.jsインストール時に付属するnpm (Node Package Manager)を使用すれば、タスク処理が実現できます。 npmとはNode.jsのモジュールを管理するためのツールであり、タスク処理にはnpmの機能のnpm-scriptsを使用します。記事はnpm-scriptsを使ったタスク実行環境が構築できることを目標に解説します。 そもそもnpm-scriptsとは何か? npm-scriptsとは、package.jsonファイルに記述可能なシェルスクリプトのエイリアスです。エイリアスとはコマンド名を別のコマンド名に置き換えることです。以下のnpm-scriptsはHello world!!を表示させるコマンドのエイリアスを作成する例です。 ▼package.jsonファイル { "scripts": { "say"

    Node.jsユーザーなら押さえておきたいnpm-scriptsのタスク実行方法まとめ - ICS MEDIA
  • minimatch(node.js で path match するライブラリ)のチートシートを作った - 詩と創作・思索のひろば

    minimatch っていうのは Grunt や gulp.js その他あちこちで(npm もらしい)使われてるグロブマッチライブラリです。最近よく gulp を使ってるんだけど、毎回 gulp.src() の書き方で迷ってしまう。調べた結果 minimatch に行き当たったんだけど各種 glob 実装のドキュメント読んで把握しろ、という感じでよく分からなかったので早見表を作った次第です。 https://github.com/motemen/minimatch-cheat-sheet 確認用にテストを書いていて、そのテストケースからドキュメントを生成してるので間違いはないはずです。説明が間違ってる、この例も乗せた方が見やすいだろ、とかあればプルリクください。 折角なので日語版を書いておきますね。 基 * はパスセパレータを含まない任意の文字列にマッチ ** はパスセパレータを含む任

    minimatch(node.js で path match するライブラリ)のチートシートを作った - 詩と創作・思索のひろば
  • 「gulpってどうなの?」に対する返答

    Gruntを使ってる人に「gulpってどうなの?」と聞かれる機会が最近何回かあったので、いまさらながら自分の所感を交えて答えてみる。 まず、自分がこれからプロジェクトを始めるとしたらgulpを使うでしょう。理由は質問に答えながら書いていきます。 Grunt使い続けちゃだめなの? そうですね。あなたがGruntに十分慣れていて、タスクのテンプレートがあってすぐに開発に入れるならGruntを使い続けてもいいと思います。ただ、今はGruntとgulp両方とも使われていますが、どっちが覇権を握るかわかりません。Gruntしか知らないままgulpの時代が来たときにノウハウの差が多少出るかもしれません。 もしあなたがGruntを片手間程度に使っていて、設定してるタスクが「ローカルサーバとライブリロード、あとminify系くらい」な人ならgulpを触ってみる価値はあると思います。同じタスクをgulpでや

    「gulpってどうなの?」に対する返答
  • gulpでJavaScriptの結合圧縮処理

    gulpJavaScriptの結合圧縮処理 gulpJavaScriptの圧縮処理を設定してみました。ご想像の通りuglifyJSですが@readymadegogoに教えてもらったuseminというプラグインも合わせて利用します。 gulpの使い方は「タスクランナーgulp入門」を参照してください。 まずは圧縮用のgulp-uglifyとgulp-useminをインストール。 sudo npm install gulp-uglify gulp-usemin --save-dev 今回の設定の肝はgulp-usemin。これを利用するとHTML上に直接圧縮処理の設定を記述できます。 たとえばHTMLを以下のように設定した場合、useminを実行したらscript1.jsとscript2.jsを圧縮結合したscript.min.jsというファイルを生成しHTML上のscriptの呼び出しを

    gulpでJavaScriptの結合圧縮処理
  • gulpとnode.jsの連携

    gulpとnode.jsの連携 Gruntと比較してgulpがイケてるなと思うのはnode.jsつまりJavaScriptを利用してカジュアルにタスクをカスタマイズできるところです。 たとえば、昨日書いたSassをコンパイルするタスクは以下のようにnode.jsでカスタマイズするとかなり便利になった。 var gulp = require('gulp'); var sass = require('gulp-sass'); var autoprefixer = require('gulp-autoprefixer'); var fs = require('fs'); var path = require("path"); //config var root = "htdocs", config = { "path" : { "htdocs" : root, "sass" : root+"/s

    gulpとnode.jsの連携
  • 「チーム開発に役立つstubcell」ってタイトルでCodeGrid 2周年パーティでLTしてきた。 - from scratch

    CodeGrid 2周年パーティでLTしてきました。 2周年おめでとうございます!! TL;DR stubcellというjsonを返すことに特化したstubサーバーを作りました 内部的にjson5を使うことで定義ファイルにコメントを書くことができ、開発者間のコミュニケーションの補助になる grunt, gulpからstubサーバーを使うことができるため、フロントエンドタスクランナーと相性が良い 発表資料 stubcell 概要 いわゆるJSONを返すことに特化したstubサーバーです。 チームで開発する時に、APIサーバー、クライアントサイド、websocketサーバーといった感じに複数の役割を複数の人数で請け負って同時並行開発することが多く、APIのエンドポイントがなくてもクライアントサイドやwebsocketでも開発できるようにするためにstubcellを作りました*1。 また複数人で

    「チーム開発に役立つstubcell」ってタイトルでCodeGrid 2周年パーティでLTしてきた。 - from scratch
  • タスクランナーgulp入門

    タスクランナーgulp入門 gulpはGruntと同じように様々なタスクを自動化してくれるツール(タスクランナー)です。 node.jsで開発されており、Sass/CompassやLess、StylusなどのCSSプリプロセッサーのコンパイルやCSS/JSの結合圧縮、JSHintによるバリデーションなど様々なタスクを自動で行ってくれます。 Gruntとできることはほとんど同じですが、Gruntよりタスクの流れがわかりやすく、JavaScript(node.js)で独自のタスクも簡単に記述することができます。 後発ということもありGruntよりプラグイン数は少ないですが、マニアックなタスク以外はそろっているので通常のWeb制作などでは問題なく利用できるでしょう。 node.jsのインストール node.jsが必要ですのでインストールしていない方はインストールしましょう。 公式サイトでインスト

    タスクランナーgulp入門
  • 1