- Notifications
You must be signed in to change notification settings - Fork8
npm run scripts
このエントリではコマンドラインからnpm run ... で起動する npm run-scripts について説明します。
なお、このエントリでは、以下のディレクトリ構成になっていることを前提に説明します。異なる場合は随時読み替えを行ってください。
詳しくは、チュートリアル環境を参照してください。
$ tree -d~/workspace ├── MyExample.js <-- 現在開発中のモジュール └── WebModule ├... └...node ../WebModule/run/setup を実行すると、package.json に以下の run-scripts(コマンド) が追加されます。
これらはコマンドラインからnpm run {コマンド名} で実行可能です。
"scripts": {"sync":"node ../WebModule/run/sync.js; npm update; node ../WebModule/run/page.js","wiki":"node ../WebModule/run/wiki.js","min":"node ../WebModule/run/minify.js --verbose --strict --keep --pretty","build":"node ../WebModule/run/minify.js --verbose --strict --keep --release","watch":"node ../WebModule/run/watch.js --verbose --run lint","page":"node ../WebModule/run/page.js --verbose","test":"npm run min; npm run node; npm run browser","node":"NODE_ENV=production NODE_PATH=lib node test/node/index.js","noded":"NODE_ENV=production NODE_PATH=lib node --debug-brk test/node/index.js","browser":"open http://localhost:8000/AppAppApp/test/browser/index.html","el":"electron test/el","add-src":"node ../WebModule/run/add-src.js","sim":"node ../WebModule/run/sim.js http://localhost:8000/AppAppApp/test/browser/index.html","simx":"node ../WebModule/run/sim.js stop","lint":"eslint lib/*.js","score":"node ../WebModule/run/score.js; open lint/plato/index.html","patch":"node ../WebModule/run/patch.js","setup":"node ../WebModule/run/setup.js","start":"cd ../; Python -m SimpleHTTPServer 8000 &","stop":"killall -- Python -m SimpleHTTPServer 8000; exit 0" }
一部のコマンドは、より短いコマンドで起動できます。
npm run startはnpm startと同じですnpm run stopはnpm stopと同じですnpm run testはnpm testと同じです。さらに省略しnpm tでも起動できます。
最新の run script 一覧 も参照してください。
最新の run script を現在のモジュール開発環境に取り込むには以下のコマンドを実行してください。
// WebModule を更新$cd~/workspace/WebModule$ git pull// 更新を開発環境に反映する$cd~/workspace/MyExample.js (または現在開発中のモジュールのディレクトリ)$ npm run setup$ npm run sync
GitHub で作成したばかりのリポジトリは空っぽの状態です。node ../WebModule/run/setup コマンドで WebModule の開発環境をセットアップする必要があります。
チュートリアル環境も参照してください。
$cd~/workspace/MyExample.js$ node ../WebModule/run/setup> - repositoryFullName: MyExample.js> - repositoryName: MyExample> - copysource dir:~/workspace/WebModule/> - copy target dir:~/workspace/MyExample.js/>> clone:~/workspace/MyExample.js/lint/plato/README.md> clone:~/workspace/MyExample.js/release/README.md>:>:> clone:~/workspace/MyExample.js/package.json> exists:~/workspace/MyExample.js/README.md - overwrite it? (y/n): y> overwrite:~/workspace/MyExample.js/README.md>> done.>> You can be next actions.>`$ npm run`# Dump all WebModule commands>`$ npm start`# Start local http server>`$ npm run sync`# Update npm modules>`$ npm t`# Minify and Test
node ../WebModule/run/setup コマンドは…
~/workspace/WebModue/*と~/workspace/MyExample.js/*を同期します- 変更されているファイルがあれば overwrite it? (y/n) を表示し入力を待ちます
yで上書きしますnや enter なら上書きせずスルーします
MyExample.js/package.json の
scriptsが追加/更新されnpm run ...コマンドが使える状態になりますnpm run setup,npm start,npm tコマンドが利用可能になります
WebModule で行われた更新を MyExample.js に取り込む事ができます
- 以下のコマンドを実行することで、必要な更新を MyExample.js に取り込む事ができます
- ~/workspace/WebModule を
git pullで更新します - ~/workspace/MyExample.js で
npm run setupコマンドを実行します
モジュールのセットアップをやり直す事ができます
- 全てやり直す場合は
npm run setupを再度実行し、全ての選択肢にyをタイプしてください
- 全てやり直す場合は
npm run setup コマンドは、node ../WebModue/run/setup を実行します。
npm run sync コマンドは、 開発環境のスキャンを行い、必要なファイルの生成やマイグレーションを行います。
WebModule/BASE_MODEL/package.json と MyExample.js/package.json の内容の同期を行います
- package.json のフォーマットチェックを行い、更新と整形を行います
- package.json が古いフォーマットで書かれている場合はマイグレーションを行います
- package.json の scripts を個別に更新します
- コマンド名が衝突した場合は、新しいコマンドを別名(コマンド名 + WebModuleのバージョン名)で追加します。
- package.json のフォーマットチェックを行い、更新と整形を行います
DEPRECATED なソースコードが存在しないかチェックを行い、改修のためのヒントを提示します。
- lib/{モジュール名}.js
- test/testcode.js
npm update を行い、外部の依存モジュールをローカルにインストールします
npm run page コマンドを実行し、テストに必要なファイル(
test/*.htmlやtest/*.js)の作成と更新を行います
$ npm run sync> uupaa.myexample.js@0.0.0 sync~/workspace/MyExample.js> node ../WebModule/run/sync.js; npm update; node ../WebModule/run/page.js>> - repositoryFullName: MyExample.js> - repositoryName: MyExample> - copysource dir:~/workspace/WebModule/> - copy target dir:~/workspace/MyExample.js/> -source package.json:~/workspace/WebModule/BASE_MODEL/package.json> - target package.json:~/workspace/MyExample.js/package.json>> done.>> uupaa.hash.js@0.0.11 node_modules/uupaa.hash.js
package.json を手動で更新した場合は、その都度npm run sync を実行してください
package.json の dependencies や devDependencies に様々な変更を加えると、次第に node_modules 以下が汚れていきます。
またnpm update 中にネットワークエラーなどで不完全なファイルコピーが行われる事があります。
そのような状態でnpm update やnpm run sync を行うと更新に失敗する事があります。
このような問題が発生した場合はrm -rf node_modules を実行し、その後でnpm run sync を実行してください
npm start コマンドは簡易httpサーバを起動します。ポートは 8000 です。http://localhost:8000/{モジュール名}.js/test/browser/index.html でモジュールのテストページにアクセスできます。
サーバを起動した状態でnpm t コマンドを実行すると、node.js やブラウザ上でテストが走ります。
Video や Audio の再生テストは、SimpleHTTPServer では上手く行きません。 nginx を使用してください。
$ npm start> Python -m SimpleHTTPServer 8000npm stop コマンドは簡易httpサーバを終了します。
$ npm stop
npm run min コマンドはデバッグ用にlib/*.js を minify し、release/*.min.js を生成します。
npm run min コマンドが生成する*.min.js には、依存する外部モジュールのコードは同梱されていません。
外部モジュールも一緒にビルドするにはnpm run build を使います。
npm run build コマンドはリリース用のビルドを行います。lib/*.js と依存関係にあるモジュールのソースコードを取り込んだ形でビルドを行い、release/*.min.js を生成します。
依存関係にあるモジュールの情報はdependencies から取得します。
npm run build で生成した release/*.min.js は、ほぼ単体で動作が可能なようにビルドされています。
<scriptsrc="../lib/WebModuleGlobal.js"></script><scriptsrc="../release/MyExample.b.min.js"></script>
npm run watch コマンドは、lib/*.js に対する変更を監視し、コマンドの--run で指定されたコマンドを実行します。
デフォルトの設定では、npm run watch コマンドは、npm run lint コマンドを起動します。
"watch":"node ../WebModule/run/watch.js --verbose --run lint",
watch で他のコマンドを実行するには、以下のように変更してください
"watch": "node ../WebModule/run/watch.js --verbose --run min", <-- npm run min コマンドを実行する "watch": "node ../WebModule/run/watch.js --verbose --command {コマンド}", <-- 任意の shell コマンドを実行するnpm run page コマンドはtest/*/template/* ファイルを元にtest/*/index.html やtest/*/index.js ファイルを生成します。
index.html やindex.js ファイルはtest/*/template ファイルを元に上書きします。消してほしくない情報があれば template 側に記述してください。
template ファイルに記述した以下のキーワードは、npm run page コマンド実行時に展開します。
__MODULES__<--依存する外部モジュールの一覧(package.jsonのdependenciesに記述されたモジュールのソースコード一覧)__WMTOOLS__<--wmtools.js__SOURCES__<-- モジュールのソースコード一覧 (package.json の webmodule/{browser|worker|node|nw|el}/source)__OUTPUT__<-- 出力先 (package.json の webmodule/{browser|worker|node|nw|el}/output)__TEST_CASE__<-- test/testcase.js
展開後はこのようになります。
<scriptsrc="../../node_modules/uupaa.typedarray.js/lib/TypedArray.js"></script><scriptsrc="../../node_modules/uupaa.random.js/lib/Random.js"></script><scriptsrc="../../node_modules/uupaa.hash.js/lib/Hash.js"></script><scriptsrc="../wmtools.js"></script><scriptsrc="../../lib/MyExample.js"></script><scriptsrc="../../release/MyExample.b.min.js"></script><scriptsrc="../testcase.js"></script>
npm t は、npm run test のシノニムです。
npm run test コマンドはnpm run minnpm run nodenpm run browser コマンドを実行します。
npm run node コマンドは node.js 上でtest/node.js のテストを実行します。
npm run noded コマンドは test/node.js を使ったテストを --debug-brk オブション付きで実行します。
このコマンドを使うと、node.js で動作するコードを、Chromium の DevTools を使いながら変数を watch したり、ブレークポイントで止めながらデバッグできます。
詳しくはこちらのエントリを参照してください。
npm run browser コマンドは ブラウザを起動しtest/browser/index.html とtest/browser/worker.js のテストを実行します。
npm run el コマンドは Electron を起動しtest/el/index.html のテストを実行します。
npm run sim コマンドは iOS Simulator を起動しtest/browser/index.html とtest/browser/worker.js のテストを実行します。
npm run simx コマンドは npm run sim コマンドにより起動している iOS Simulator のインスタンスを終了します。
npm run lint コマンドはeslint lib/*.js を実行し結果を画面に表示します。
npm run score コマンドはカバレッジツール(Plato)を実行し、lib/*.js の静的解析を行った結果を点数化しブラウザに表示します。
npm run patch コマンドは package.json の version プロパティの末尾の番号(パッチバージョン)を +1 します。
> node ../WebModule/run/patch.jsupdate patch version. 0.0.10 -> 0.0.11
Semver を参照してください。