タグ

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

タグの絞り込みを解除

browserifyに関するrochefortのブックマーク (7)

  • webpack+babel-loader+power-assert+jsdomでフロントエンド開発環境を作る - yutaponのブログ

    この記事は JavaScript Advent Calendar 2015 10日目の記事です。 去年は主に gulp にフォーカスした内容でしたが、今回はJSのビルドとテストにフォーカスした入門記事です。 やること ES2015で書いたコードをWebpackでビルドする babel@6系を使う Mocha + power-assert + jsdom でテストを書く やらないこと gulpまわり React.js CSSビルドまわり 最終的なコードはこちらに上げておきました(すごく簡素な出来です)。 GitHub - sskyu/webpack-power-assert-jsdom-skeleton はじめに 今年はReact.jsがJSerの中で定着した感がありました。 Fluxの考え方を昇華させたReduxがFlux系フレームワークでデファクトになりそうな雰囲気を出しつつ、React

    webpack+babel-loader+power-assert+jsdomでフロントエンド開発環境を作る - yutaponのブログ
    rochefort
    rochefort 2016/01/11
    phantomjsに比べてjsdomのメリットは 簡単なDOMのテストができること 速度が速いこと// ユニットテストはCLI、ブラウザテストはE2E // npm visnup びびった
    リンク

  • JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog;


    最近JSを利用するときは、依存モジュールはnpmを利用し、ES6やTypeScriptの仕様を開発には使った上で、ブラウザ用にコンパイルして配信するようになってきている。また同時にネットワークの負荷を下げるためにminifyを行う場合もある。 minifyはライセンスが絡むと少し難しい。例えばコメントを全て削除してしまうとライセンスコメントまで消えてしまう。この問題にはみんながそれぞれの手法で対処しているみたい。1年ほど前の記事でクライアントサイドJavaScriptのライセンス管理 | エンジニアブログ | GREE Engineering というものがあり、いろんなJSのコンパイルのためのライブラリが独自でライセンスの形式を決めていて、それにマッチしないものは消えてしまう、みたいな辛いことが起きてそうだった。 そこで今回は自分の勉強も兼ねて、npmのモジュールを含めてブラウザ用にコンパ
    JSをbrowserifyでビルドし、ライセンスコメントを適切に残す - $shibayu36->blog;

  • モダンJavaScript開発環境 on Rails - クックパッド開発者ブログ


    投稿推進部の外村︵@hokaccha︶です。 クックパッドブログの開発でRails上にECMAScript6などのモダンなJavaScript開発環境を導入した経験を元にノウハウを紹介したいと思います。 RailsはSprocketsというgemでJavaScriptやCSSをコンパイルする仕組みが提供されています。Sprocketsによるasset管理の仕組みは非常によくできており、AltJSのトランスパイルやファイルの結合、minifyなど、assetのコンパイルに必要な機能を一通り備えています。 しかし、JavaScriptにおけるモジュールの依存関係の解決や、ライブラリの管理などについてはモダンなJavaScript開発と乖離してきているのが現状です。そこで、Railsでも以下のようなことを実現できることを目標に環境を作りました。 ECMAScript6のシンタックスを使う モジュ
    モダンJavaScript開発環境 on Rails - クックパッド開発者ブログ
    rochefort
    rochefort 2016/01/05
    cookpadさんはbrowserify-rails。37signalsはどうしてんだろうか。
    リンク

  • 俺の最近のRailsのJS開発環境を教えてやる - Qiita


    はじめに railsのsprocketsがキツイ。特にjsファイルが多くなると開発がとっってもキツイ。 layoutに こうやってるだけでも出力されたhtmlにはscriptタグが30個ぐらいならんでて、ページの読み込みに10sec以上かかる。 だけど、単にapp/assets/javascriptsをgulp watchとかはしたくない。 なぜならビルドはブラウザのリロード時に変更がある場合だけして欲しかった。 あとwindow.AppNamespace以下にモジュール追加していくのも辛い。 モジュール同士の依存関係もよくわかんないし、何よりwindow.AppNamespace.Modules.UserList.ItemViewとか長すぎ！ browserify-railsってやつ使ってみた browserifyがrailsの仕組みの中で動くようになる。 browserify-rail
    俺の最近のRailsのJS開発環境を教えてやる - Qiita
    rochefort
    rochefort 2015/07/16
    フロントエンドは大変
    リンク

  • フロントエンド開発の３ステップ（npmことはじめ） - Qiita


    スライド 当記事は以前勉強会でLTしたものです。 スライドは下記にあります。 フロントエンド覚えること多すぎ問題 モダンなフロントエンド開発で、入門記事を探そうとすると、 まずwebpackやTypeScript, Babelによるビルド環境構築から始まる記事が多くヒットします。 ですが、Node.jsの初心者がいきなり複数のツールを習得しようとすることが 挫折の原因になっていると感じています。 ですので、まずNode.jsをインストールした直後から、必ず使うことになる、npmの機能をまず覚えておきましょう。 フロントエンド開発で覚えるべき3つのコマンド 以下の3つだけ覚えておきましょう。npminitnpm install npm run これだけ覚えれば、ひとまずフロントエンド開発を進めることができます。 完璧なワークフローを構築するのは、書いているアプリが大きくなってきてから
    フロントエンド開発の３ステップ（npmことはじめ） - Qiita

  • Browserifyの使い方について調べてみた - yutaponのブログ


    最近Browserifyって単語を良く見るようになりました。 Browserifyをざっくり説明すると、 ブラウザ上でもNode.js用モジュールを使えるようにする ブラウザでもrequire()を使ったモジュール管理を使えるようにする という特徴があるようです。 browser︵ブラウザ︶+ fy︵〜する︶という単語からもNode.jsをブラウザ化するってニュアンスでしょうか。 require()といえばRequireJSも提供してますよね。 Browserify使うことでRequireJSを使わなくてもモジュール管理ができるようになりそうです。 Browserifyの使い方 まずは公式サイトに載ってるコードを試してみます。 browserify これはどうやらNode.js向けのモジュールをブラウザでも使えるようにするチュートリアルのようです。 まず作業ディレクトリを作成します。 $
    Browserifyの使い方について調べてみた - yutaponのブログ

  • browserify をはじめてみる


    Browserify を触ってみたメモ。 Browserify とはCommonJS のモジュールの仕組み、つまり Node.js の requireをブラウザ上でも使えるようにするもの、ということでいいみたい。Readme を読む限りは、npm にあるモジュールをブラウザ上にもっていくために作られ始めたような印象をうけるが、ちまたのエントリーをみていると AMD に代わりにCommonJS でフロントエンドの依存関係の管理をする (RequireJS ではなく、Node.js 感覚で require関数をフロントエンドで使う) ためのツールとしても使っていいようだ。 やりたいこと 複数のjsファイルの依存関係を記述したい 最終的に、依存関係を考慮した順番で、ひとつのjsファイルに結合したい 作りたいのは第三者のサイトに埋め込んでもらうスクリプト (サードパーティスクリプト
    browserify をはじめてみる
  • 1

お知らせ

もっと読む

公式Twitter

  • @HatenaBookmark

    リリース、障害情報などのサービスのお知らせ

  • @hatebu

    最新の人気エントリーの配信

はてなブックマーク

公式Twitter

はてなのサービス

  • App Storeからダウンロード
  • Google Playで手に入れよう
Copyright © 2005-2024 Hatena. All Rights Reserved.