bowerはjsの依存管理を解決します。

15865 ワード
js。
http://segmentfault.com/a/1190000000349555
http://blog.fens.me/nodejs-bower-intro/
ゼロから始まるnodejsシリーズの文章は、Javascriptをサーバースクリプトとして紹介し、Nodejsフレームワークを通じてウェブ開発する。NodejsフレームはV 8ベースのエンジンで、現在最も速いJavascriptエンジンです。chromeブラウザはV 8に基づいて、同時に20-30のホームページを開けても流暢です。Nodejs標準のweb開発フレームワークExpressは、PHPの開発効率よりも急速にwebサイトを立ち上げることができ、学習曲線がより低いです。とても小さいウェブサイトに適して、個性的なウェブサイト、私達自身のGeekウェブサイト！
はじめに、新しいwebプロジェクトが始まります。私たちはいつも自然に必要なjsクラスのファイルをダウンロードします。例えば、jQuery、公式サイトに行ってjquery-1.10.2.min.jsファイルをダウンロードします。私たちのプロジェクトに入れます。プロジェクトがbootstrapを必要とする時、私達は先ほどの仕事を繰り返して、bootstrap公式サイトに対応するクラスライブラリをダウンロードします。もしbootstrapが依存しているjQueryが1.10.2ではなく、2.0.3の時に、もう一つの対応バージョンのjQueryをダウンロードして元のものに換えます。
パッケージ管理は複雑な問題です。誰が誰に依存しているかを知りたいです。どのバージョンがどのバージョンに依存しているかを明確にしなければなりません。これらは開発者にとって負担が重すぎます。bowerはjsの管理に依存するツールとして、理想的なパッケージ管理方式を提供し、npmのいくつかの思想を助けて、快適な開発環境を提供してくれます。
まだ手を動かせずにbowerを試してみてください。フロントエンドの開発がどんなに楽しいかは、あなたには分かりません。
目次
  • bower紹介
  • bowerインストール
  • パワーコマンド
  • bowerは
    • を使用します。
  • .自分のクラスライブラリをbowerで提出する
    • 。
    1.パワー紹介
    Bowerはtwitterが導入したパッケージ管理ツールで、nodejsのモジュール化思想に基づいて、機能を各モジュールに分散させ、モジュールとモジュールの間に連絡を取り、Bowerを通じてモジュール間のこのような連絡を管理します。
    パッケージ管理ツールは主に以下の機能があります。
  • 登録メカニズム：各パケットは一意のIDを決定し、検索とダウンロードの際に正確に一致するようにする必要があるので、他のプラットフォームに依存して登録情報を維持する必要がある。
  • ファイルの保存：ファイルの保存場所を確定して、ダウンロードする時探し当てることができて、もちろんこの住所はネットの上でアクセスすることができます。
  • アップロードはダウンロードします。これはツールの主な機能で、カバンの使用の利便性を高めることができます。例えばjqueryを使いたいなら、installだけでいいです。あちこち探してダウンロードしなくてもいいです。アップロードは必須ではありません。ファイルの保存位置によって異なりますが、ある程度の仕組みが必要です。
  • は分析に依存しています。これも管理ツールの主な解決の問題の一つです。カバンの間に連絡がある以上、ダウンロードする時は彼らの間の依存を処理しなければなりません。一つのカバンをダウンロードする時も依存のカバンをダウンロードしなければなりません。
    • 機能紹介、文章から抜粋：http://chuo.me/2013/02/twitter-bower.html
    2.パワーインストール
    bowerプラグインはnpmを通じて、Node.jsパッケージマネージャのインストールと管理を行います。
    私のシステム環境
  • win 7 64 bit
  • Nodejs：v 0.0.5
  • Npm：1.2.19 
    • ~ D:\workspace\javascript>node -v
v0.10.5

~ D:\workspace\javascript>npm -v
1.2.19
    システムの中で、Nodejsとnpmをインストールしました。win 7 nodejsをインストールします。記事を参照してください。Nodejs開発フレームExpress 3.0開発手記–ゼロから。
    インストール グローバルインストール
    ~ D:\workspace\javascript>npm install bower -g
    新しいexpress 3のプロジェクトnodejs-bowerを作成します。
    ~ D:\workspace\javascript>express -e nodejs-bower
~ D:\workspace\javascript>cd nodejs-bower && npm install
    3.パワーコマンド
    bowerをインストールしたら、私たちはこのコマンドを使うことができます。
    ~ D:\workspace\javascript
    odejs-bower>bower
Usage:
    bower  [] []
Commands:
    cache                   Manage bower cache
    help                    Display help information about Bower
    home                    Opens a package homepage into your favorite browser
    info                    Info of a particular package
    init                    Interactively create a bower.json file
    install                 Install a package locally
    link                    Symlink a package folder
    list                    List local packages
    lookup                  Look up a package URL by name
    prune                   Removes local extraneous packages
    register                Register a package
    search                  Search for a package by name
    update                  Update a local package
    uninstall               Remove a local package
Options:
    -f, --force             Makes various commands more forceful
    -j, --json              Output consumable JSON
    -l, --log-level         What level of logs to report
    -o, --offline           Do not hit the network
    -q, --quiet             Only output important information
    -s, --silent            Do not output anything, besides errors
    -V, --verbose           Makes output more verbose
    --allow-root            Allows running commands as root
See 'bower help ' for more information on a specific command.
    Commundsは、bowerサポートの各種コマンドを一覧表示します。
  • cache：bowerキャッシュ管理
  • help:Bowerコマンドを表示するヘルプ情報
  • home:ブラウザを通じて鞄のgithubを開いてページを発表します。
  • info：カバンの情報を確認する
  • init：bower.jsonファイルを作成する
  • install:パッケージをプロジェクト
    • にインストールします。
  • link：ローカルbowerライブラリにプロジェクトリンク
    • を作成します。
  • list：プロジェクトがインストールされたパッケージを一覧表示します。
  • lookup：パケット名に基づいてパケットのURLを検索する
  • prune：項目に関係のないパケットを削除します。
  • register：登録パッケージ
  • search:検索パケット
  • udate：更新項目のパッケージ
  • uninstall:プロジェクトのパッケージを削除します。
    • 4.パワーを使う
    1）プロジェクトのnodejs-bowerにjQueryをインストールする
    ~ D:\workspace\javascript
    odejs-bower>bower install jquery
bower jquery#*              not-cached git://github.com/components/jquery.git#*
bower jquery#*                 resolve git://github.com/components/jquery.git#*
bower jquery#*                download https://github.com/components/jquery/archive/2.0.3.tar.gz
bower jquery#*                 extract archive.tar.gz
bower jquery#*                resolved git://github.com/components/jquery.git#2.0.3
bower jquery#~2.0.3            install jquery#2.0.3

jquery#2.0.3 bower_components\jquery
    命令を実行することで、jQueryの最新バージョンがダウンロードされ、プロジェクトのbower_にインストールされているのを見ることができます。components\jqueryディレクトリ
    パワーチェックcomponents/jqueryディレクトリで、3つのファイルが見つかりました。
    ~ D:\workspace\javascript
    odejs-bower>ls bower_components/jquery -a
.  ..  .bower.json  component.json  jquery.js
    同じように、私たちのプロジェクトにはd 3のクラスが必要です。
    ~ D:\workspace\javascript
    odejs-bower>bower install d3
bower d3#*                  not-cached git://github.com/mbostock/d3.git#*
bower d3#*                     resolve git://github.com/mbostock/d3.git#*
bower d3#*                    download https://github.com/mbostock/d3/archive/v3.2.8.tar.gz
bower d3#*                     extract archive.tar.gz
bower d3#*                    resolved git://github.com/mbostock/d3.git#3.2.8
bower d3#~3.2.8                install d3#3.2.8

d3#3.2.8 bower_components\d3
    とても便利です。ダウンロードしてインストールしました。
    2）プロジェクトで導入されたライブラリを確認する
    ~ D:\workspace\javascript
    odejs-bower>bower list
bower check-new     Checking for new versions of the project dependencies..
nodejs-bower#0.0.0 D:\workspace\javascript
    odejs-bower
├── d3#3.2.8
└── jquery#2.0.3
    3）bootstrapライブラリを設置し、依存状況を確認する
    ~ D:\workspace\javascript
    odejs-bower>bower install bootstrap
bower bootstrap#*               cached git://github.com/twbs/bootstrap.git#3.0.0-rc1
bower bootstrap#*             validate 3.0.0-rc1 against git://github.com/twbs/bootstrap.git#*
bower jquery#>= 1.9.0           cached git://github.com/components/jquery.git#2.0.3
bower jquery#>= 1.9.0         validate 2.0.3 against git://github.com/components/jquery.git#>= 1.9.0
bower bootstrap#~3.0.0-rc1     install bootstrap#3.0.0-rc1

bootstrap#3.0.0-rc1 bower_components\bootstrap
└── jquery#2.0.3

~ D:\workspace\javascript
    odejs-bower>bower list
bower check-new     Checking for new versions of the project dependencies..
nodejs-bower#0.0.0 D:\workspace\javascript
    odejs-bower
├─┬ bootstrap#3.0.0-rc1 extraneous
│ └── jquery#2.0.3
├── d3#3.2.8
└── jquery#2.0.3
    私たちはbootstrapを発見しました。jqueryに依存しています。
    4）jQueryライブラリを削除し、依存関係を破壊する
    ~ D:\workspace\javascript
    odejs-bower>bower uninstall jquery
bower conflict      bootstrap depends on jquery
Continue anyway? (y/n) y
bower uninstall     jquery

~ D:\workspace\javascript
    odejs-bower>bower list
bower check-new     Checking for new versions of the project dependencies..
nodejs-bower#0.0.0 D:\workspace\javascript
    odejs-bower
├─┬ bootstrap#3.0.0-rc1 extraneous
│ └── jquery missing
├── d3#3.2.8
└── jquery missing
    5）低バージョンのjQueryをインストールして、製造はバージョン互換ではありません。
    ~ D:\workspace\javascript
    odejs-bower>bower install jquery#1.7.2
bower jquery#~2.0.3             cached git://github.com/components/jquery.git#2.0.3
bower jquery#~2.0.3           validate 2.0.3 against git://github.com/components/jquery.git#~2.0.3
bower jquery#>= 1.9.0           cached git://github.com/components/jquery.git#2.0.3
bower jquery#>= 1.9.0         validate 2.0.3 against git://github.com/components/jquery.git#>= 1.9.0
bower jquery#1.7.2              cached git://github.com/components/jquery.git#1.7.2
bower jquery#1.7.2            validate 1.7.2 against git://github.com/components/jquery.git#1.7.2

Unable to find a suitable version for jquery, please choose one:
    1) jquery#1.7.2 which resolved to 1.7.2
    2) jquery#~2.0.3 which resolved to 2.0.3 and has nodejs-bower as dependants
    3) jquery#>= 1.9.0 which resolved to 2.0.3 and has bootstrap#3.0.0-rc1 as dependants

Prefix the choice with ! to persist it to bower.json

Choice: 1
bower jquery#1.7.2             install jquery#1.7.2

jquery#1.7.2 bower_components\jquery

~ D:\workspace\javascript
    odejs-bower>bower list
bower check-new     Checking for new versions of the project dependencies..
nodejs-bower#0.0.0 D:\workspace\javascript
    odejs-bower
├─┬ bootstrap#3.0.0-rc1 extraneous
│ └── jquery#1.7.2 incompatible with >= 1.9.0 (2.0.3 available)
├── d3#3.2.8
└── jquery#1.7.2 incompatible with ~2.0.3 (2.0.3 available)
    私達ははっきりとbowerを見ることができます。はっきりと教えてくれました。jqueryとbootstrapは互換性がないので、強いところは皆さんが経験してみてください。
    6）jQueryをアップグレードし、バージョンを互換させる
    ~ D:\workspace\javascript
    odejs-bower>bower update jquery
bower jquery#~2.0.3             cached git://github.com/components/jquery.git#2.0.3
bower jquery#~2.0.3           validate 2.0.3 against git://github.com/components/jquery.git#~2.0.3
bower jquery#>= 1.9.0           cached git://github.com/components/jquery.git#2.0.3
bower jquery#>= 1.9.0         validate 2.0.3 against git://github.com/components/jquery.git#>= 1.9.0
bower jquery#~2.0.3            install jquery#2.0.3

jquery#2.0.3 bower_components\jquery

~ D:\workspace\javascript
    odejs-bower>bower list
bower check-new     Checking for new versions of the project dependencies..
nodejs-bower#0.0.0 D:\workspace\javascript
    odejs-bower
├─┬ bootstrap#3.0.0-rc1 extraneous
│ └── jquery#2.0.3
├── d3#3.2.8
└── jquery#2.0.3
    なんとスマートで、ワンタッチで解決することが効率的な開発です。
    7）ローカルのbowerがキャッシュされているライブラリを確認する
    ~ D:\workspace\javascript
    odejs-bower>bower cache list
bootstrap=git://github.com/twbs/bootstrap.git#3.0.0-rc1
d3=git://github.com/mbostock/d3.git#3.2.8
jquery=git://github.com/components/jquery.git#1.7.2
jquery=git://github.com/components/jquery.git#2.0.3
    8）D 3ライブラリの情報を確認する
    ~ D:\workspace\javascript
    odejs-bower>bower info d3
d3

  Versions:
    - 3.2.8
    - 3.2.7
    - 3.2.6
    - 3.2.5
    - 3.2.4
    - 3.2.3
    ...
    9）ドジョックのurlを確認する
    ~ D:\workspace\javascript
    odejs-bower>bower lookup dojo
dojo git://github.com/dojo/dojo.git
    10）ブラウザでdojoの公開ホームページを開く
    ~ D:\workspace\javascript
    odejs-bower>bower home dojo
bower dojo#*                not-cached git://github.com/dojo/dojo.git#*
bower dojo#*                   resolve git://github.com/dojo/dojo.git#*
bower dojo#*                  download https://github.com/dojo/dojo/archive/1.9.1.tar.gz
bower dojo#*                   extract archive.tar.gz
bower dojo#*                  resolved git://github.com/dojo/dojo.git#1.9.1
    ブラウザが自動的に開く:https://github.com/dojo/dojo
    11）dojoを含むクラスライブラリを照会する
    ~ D:\workspace\javascript
    odejs-bower>bower search dojo
Search results:

    dojo git://github.com/dojo/dojo.git
    dojox git://github.com/dojo/dojox.git
    dojo-util git://github.com/dojo/util.git
    dojo-bootstrap git://github.com/samvdb/Dojo-Bootstrap
    本当に便利で実用的な技術です。
    5.自分のクラスにbowerで提出する
    1）bower.jsonプロファイルを生成する
    ~ D:\workspace\javascript
    odejs-bower>bower init
bower existing      The existing bower.json file will be used and filled in
[?] name: nodejs-bower
[?] version: 0.0.0
[?] main file:
[?] set currently installed components as dependencies? No
[?] add commonly ignored files to ignore list? Yes
    作成したファイルのbower.jsonを表示します。
    {
  "name": "nodejs-bower",
  "version": "0.0.0",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {
    "d3": "git://github.com/mbostock/d3.git#~3.2.8",
    "jquery": "git://github.com/components/jquery.git#~2.0.3"
  }
}
    2）ギthubでリソースライブラリを作成する：nodejs-bower 3）.ローカルエンジニアリングバインディングgithub
    ~ D:\workspace\javascript
    odejs-bower>git init
Initialized empty Git repository in D:/workspace/javascript/nodejs-bower/.git/

~ D:\workspace\javascript
    odejs-bower>git add .
~ D:\workspace\javascript
    odejs-bower>git commit -m "first commit"
# On branch master
#
# Initial commit
#
# Untracked files:
#   (use "git add ..." to include in what will be committed)
#
#       app.js
#       bower.json
#       bower_components/
#       node_modules/
#       package.json
#       public/
#       routes/
#       views/
nothing added to commit but untracked files present (use "git add" to track)

~ D:\workspace\javascript
    odejs-bower>git remote add origin https://github.com/bsspirit/nodejs-bower

~ D:\workspace\javascript
    odejs-bower>git push -u origin master
Counting objects: 565, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (516/516), done.
Writing objects: 100% (565/565), 803.08 KiB, done.
Total 565 (delta 26), reused 0 (delta 0)
To https://github.com/bsspirit/nodejs-bower
 * [new branch]      master -> master
Branch master set up to track remote branch master from origin.
    4）bowerオフィシャルクラスに登録する
    ~ D:\workspace\javascript
    odejs-bower>bower register nodejs-bower [email protected]:bsspirit/nodejs-bower.git
bower                          convert Converted [email protected]:bsspirit/nodejs-bower.git to git://github.com/bsspirit/n
odejs-bower.git
bower nodejs-bower#*           resolve git://github.com/bsspirit/nodejs-bower.git#*
bower nodejs-bower#*          checkout master
bower nodejs-bower#*          resolved git://github.com/bsspirit/nodejs-bower.git#af3ceaac07
Registering a package will make it visible and installable via the registry (https://bower.herokuapp.com), continue? (y/
n)                    y
bower nodejs-bower            register git://github.com/bsspirit/nodejs-bower.git

Package nodejs-bower registered successfully!
All valid semver tags on git://github.com/bsspirit/nodejs-bower.git will be available as versions.
To publish a new version, you just need release a valid semver tag.

Run bower info nodejs-bower to list the package versions.
    5）.自分のカバンを調べてください。
    D:\workspace\javascript
    odejs-bower>bower search nodejs-bower
Search results:

    nodejs-bower git://github.com/bsspirit/nodejs-bower.git
    6）自分達のカバンを取り付ける
    D:\workspace\javascript
    odejs-bower>bower install nodejs-bower
bower nodejs-bower#*            cached git://github.com/bsspirit/nodejs-bower.git#af3ceaac07
bower nodejs-bower#*          validate af3ceaac07 against git://github.com/bsspirit/nodejs-bower.git#*
bower nodejs-bower#*           install nodejs-bower#af3ceaac07

nodejs-bower#af3ceaac07 bower_components
    odejs-bower
├── d3#3.2.8
└── jquery#2.0.3
    実はモジュール化、バージョン依存、クラスライブラリの開発、クラスライブラリのリリース、クラスライブラリのインストールは、すべてのコマンドです！もっと簡単にできますか？プロジェクトをモジュール化して、みんなに共有しましょう。未来は開発者のものです。
    転載は出典を明記してください。http://blog.fens.me/nodejs-bower-intro/
    java基本コード思想解決案
    Windows mobileメニュー(Menu Bar)変更ソリューション