Gruntのwiredepタスクの構成説明ドキュメント

1528 ワード

Automatically inject Bower components into the HTML file
自動的にBowerのコンポーネントをHTMLファイルに注入する
コンポーネントを以下の方法でインストールすると

bower install jquery --save
bower install sea.js --save

インストール後はbowerにあります.jsonファイルに表示されます

{
  "name": "framework-demo",
  "private": true,
  "dependencies": {
    "jquery": "~2.1.4",
    "jquery-ui": "~1.11.4",
    "knockout": "^3.3.0",
    "seajs": "^3.0.0"
  }
}

Gruntfile.jsファイルでのwirdep Taskの構成

  wiredep: {
      app: {
        src: ['<%= config.app %>/index.html'],
        ignorePath: /^(\.\.\/)*\.\./
      }
    }

grunt wiredepコマンドの実行
indexでhtmlファイルは、デフォルトのdependencies依存のコンポーネントを自動的に次のラベルに注入します.

 <!-- bower:js -->
    <script src="/bower_components/jquery/dist/jquery.js"></script>
    <script src="/bower_components/jquery-ui/jquery-ui.js"></script>
    <script src="/bower_components/knockout/dist/knockout.js"></script>
    <script src="/bower_components/seajs/dist/sea.js"></script> 
<!-- endbower -->

Wiredepのoptionのパラメータ
devDependencies:開発版の依存コンポーネントを注入します.
dependencies:依存コンポーネントを注入する;
directory: 'the directory of your Bower packages.' bowerパッケージを格納するディレクトリです.このディレクトリは'.Powerrcファイルのdirectory

オープンソースMBaaS「BaasBox」を使ってみる(1) インストールからログインまで

SSHを取得してGithubリモートストレージ(for Mac)に接続しましょう