web-dev-qa-db-ja.com

bowerは自動的に<script>タグをindex.htmlに書き込むことができますか?

ヨーマンのバックボーンジェネレーターを使用して、これを実行しました。

bower install backbone.localStorage -S

そして、これをindex.htmlに手動で挿入する必要がありました。

<script src="bower_components/backbone.localStorage/backbone.localStorage.js"></script>

Bowerが<script>タグを自動的に挿入する方法はありますか?バウアーのメリットの一部は、スクリプトを含める順序を把握する必要がないことだと思いましたか?

61
CaptSaltyJack

ただ走れ

grunt bowerInstall 

バウワーのインストール後

43
mvilrokx

wiredep を使用して、bowerからHTMLコードに依存関係をプッシュできます。これがアプローチです generator-angularで使用yo angularを実行するとき:

var wiredep = require('wiredep');
wiredep({
   directory: 'app/bower_components',
   bowerJson: JSON.parse(fs.readFileSync('./bower.json')),
   ignorePath: 'app/',
   htmlFile: 'app/index.html',
   cssPattern: '<link rel="stylesheet" href="{{filePath}}">'
});
16
Kato

Bowerはこのような特定の機能のサポートを追加しませんが、すぐに新しいパッケージを「bowerインストール」した後に実行するアクションを指定できるようになります。これは、npmと同様に「ポストインストール」と呼ばれます。

ただし、当面は、これを支援するライブラリを作成しました。 yeomanを使用しているので、「grunt-bower-install」をnpm 'devDependency'として追加し、次の指示に従ってください。 https://github.com/stephenplusplus/grunt-bower-install =。

8
Stephen

--saveを使用

bower install --save <YOUR_PACKAGE>

--saveオプションは、bower.jsonファイルを依存関係で更新します。これにより、自分でbower.jsonに手動で追加する必要がなくなります。 index.htmlの下部にあるスクリプトセクションが自動的に更新されていることがわかります。

リファレンス: http://yeoman.io/codelab/install-packages.html

4