次の npm ビルド ツールの組み合わせを使用してブラウザー アプリケーションを開発しています。
- ブラウザ化
- Coffeeify
- 見る
私のpackage.jsonファイルのスクリプト部分は次のとおりです。
"scripts": {
"build": "browserify -t coffeeify init.coffee -o ../www/bundle.js",
"watch": "watchify -t coffeeify init.coffee -o ../www/bundle.js"
}
これまでのところ、作業を開始する前に「npm run watch」コマンドを入力すると、更新するたびにすべての CoffeeScript ファイルが bundle.js ファイルに自動的にバンドルされるようにプロジェクトを構成しました。さらに、いくつかの .SCSS ファイルが必要です。これらのファイルは自動的に .CSS ファイルにコンパイルされ、すべてがバンドルされて min.css ファイルに縮小されます。そして、理想的には、CS ファイルに対して既に入力しているコマンド (「npm run watch」) 以外のコマンドを入力することなく、これを達成したいと考えています。
ここに私のpackage.json devDependenciesがあります:
"devDependencies": {
"coffee-script": "^1.10.0",
"coffeeify": "^2.0.1",
"browserify": "^12.0.1",
"watchify": "^3.6.0",
"node-sass": "^3.4.2",
"yuicompressor": "^2.4.8"
}
これまでのところ、PhpStorm のファイル ウォッチャーと node-sass npm モジュールを使用して、.SCSS ファイルを .CSS ファイルに正常にコンパイルできるところまで来ました。いくつか読んだ後、yui コンプレッサーを使用することにしました (上記のように、Node モジュールとしてもインストールされています)。しかし、何度も検索した結果、これを行う方法の適切な説明が見つかりませんでした。
次を更新する必要がありますか?
"watch": "watchify -t coffeeify init.coffee -o ../www/bundle.js"
私のpackage.jsonファイルの行?もしそうなら、どのように?
SCSS フォルダーのファイルが変更されるたびに、他のフォルダーの min.css ファイルが自動的に再コンパイルされるような最終結果が必要です。
(私の目的により良いオプションがあれば、必ずしも yui コンプレッサーを使用することを主張しているわけではありません。)