Spring Boot + npm + Geb で入力フォームを作ってテストする ( その36 )( Node.js を 6.11.1 → 8.9.1 へ、npm を 4.0.5 → 5.5.1 へバージョンアップする )
概要
記事一覧はこちらです。
Spring Boot + npm + Geb で入力フォームを作ってテストする ( その35 )( Geb でテストを作成する2 ) の続きです。
- 今回の手順で確認できるのは以下の内容です。
- https://nodejs.org/ja/ を見ると Node.js の推奨版が 8.9.1 LTS になっていたので、バージョンアップします。
- npm も 5.5.1 へバージョンアップし、5.2.0 以降で使えるようになった npx コマンドを試してみます。
参照したサイト・書籍
Node8の注目的変更まとめ
http://abouthiroppy.hatenablog.jp/entry/2017/05/30/090015npm 5.2.0の新機能! 「npx」でローカルパッケージを手軽に実行しよう
https://qiita.com/tonkotsuboy_com/items/8227f5993769c3df533dnodistでNode.jsのバージョン管理
https://qiita.com/hitomatagi/items/ad5f28ccd095b962f8ba
目次
手順
Node.js を 6.11.1 → 8.9.1 へ、npm を 4.0.5 → 5.5.1 へバージョンアップする
nodist dist
コマンドを実行して 8.9.1 がインストール可能か確認します。
8.9.1 が表示されていますので、8.9.1 へバージョンアップします。
npm も最新版にバージョンアップします。npm の最新バージョンは https://docs.npmjs.com/ の一番下を見ると 5.5.1 とありましたので、
5.5.1 にバージョンアップします。
npm run springboot
コマンドを実行すると特にエラーが出ずに各 npm-scripts も実行されました。
npx コマンドを使用してみる+package.json を変更する
npm のバージョンを 5.2.0 以降にすれば npx コマンドが使えるとのことですが、npx コマンドを実行しようとしてもコマンドがありませんでした。
nodist で npm をバージョンアップすると npm 自体のバージョンは上がりますが、npx が入っていないようです。npm install -g npm@5.5.1
でバージョンアップしてみます。
今度は npx コマンドが使えるようになりました。
npx コマンドで直接パッケージを呼び出せるようになりましたので、package.json から不要な npm-scripts を削除します。
"scripts": { "test": "echo \"Error: no test specified\" && exit 1", "postinstall": "run-s clean:static-dir copy:all", "clean:static-dir": "rimraf src/main/resources/static/*", "copy:all": "run-p copy:bootstrap copy:admin-lte copy:font-awesome copy:ionicons copy:jquery-ui-css", "copy:bootstrap": "cpx node_modules/bootstrap/dist/**/* src/main/resources/static/vendor/bootstrap", "copy:admin-lte": "cpx node_modules/admin-lte/dist/**/* src/main/resources/static/vendor/admin-lte", "copy:font-awesome": "cpx node_modules/font-awesome/{css,fonts}/**/* src/main/resources/static/vendor/font-awesome", "copy:ionicons": "cpx node_modules/ionicons/dist/{css,fonts}/**/* src/main/resources/static/vendor/ionicons", "copy:jquery-ui-css": "cpx node_modules/jquery-ui/themes/base/**/* src/main/resources/static/vendor/jquery-ui/css", "postcss:watch": "postcss src/main/assets/css/**/* -d src/main/resources/static/css -x .min.css -w --poll", "webpack:watch": "webpack --watch", "browser-sync:start": "browser-sync start --config bs-config.js", "browser-sync:springboot": "browser-sync start --config bs-springboot-config.js", "server": "run-p postcss:watch webpack:watch browser-sync:start", "springboot": "run-p postcss:watch webpack:watch browser-sync:springboot" },
- 以下の2行を削除します。
"webpack": "webpack"
"browser-sync": "browser-sync"
npx でパッケージが直接呼び出せるようになりましたので、npx webpack -v
を実行すれば webpack のバージョンが表示されます。
履歴
2017/11/27
初版発行。