Laravel5.5をインストールしてLaravel Mixの実行まで

npm周りで大分苦戦しましたがなんとか出来ましたので次回以降困らない用にメモ

追記：2017/09/18
npm run devで以下のエラーが出るようになっていました。

 95% emitting

 ERROR  Failed to compile with 1 errors                                                                                              21:12:50

 error  in ./resources/assets/js/components/Example.vue

Module build failed: Error: Cannot find module './lib/beautify'

issueが上がっていたのでいつか直るかもしれません
https://github.com/JeffreyWay/laravel-mix/issues/1198
https://github.com/beautify-web/js-beautify/issues/1247
とりあえず
devDependenciesに
"js-beautify": "1.6.14"
を追加したら通りました。

js-beautifyが壊れて動かなくなったようです。
vue-loaderがjs-beautifyを使っていてエラーになっていたようです。
vue-loaderの方がjs-beautifyを使わない修正を入れたようなのでvue-loaderを更新すればよいみたいな流れになりそうです。

追記：2017/09/19
devDependenciesに
"vue-loader": "^13.0.5"
を追加で対応する方法でも問題なく動作しました。

環境

上記設定でDockerイメージを作ってそこからコンテナを作ってその中で作業しています。

# cat /etc/redhat-release
CentOS Linux release 7.3.1611

# node -v
v8.1.4

# npm -v
5.3.0

Laravel5.5のインストール

/home/public/app/にインストールします。
nginxのルート設定は/home/public/app/public(Laravelインストール後にできるフォルダ)

cd /home/public/app/
composer create-project --prefer-dist laravel/laravel:5.5.0 .

Laravel Mixをインストール

Laravel Mix（CSSやJavaScriptをビルドするツールらしいです）

コマンド

# npm install --no-bin-links --no-optional

オプション

--no-bin-links

symlinkのエラーを回避するため

Symlinks on shared volumes not supported
Docker for Windows
https://forums.docker.com/t/symlinks-on-shared-volumes-not-supported/9288

--no-optional

fseventsのエラーを回避するため

fseventsはOPTIONAL DEPENDENCYで MacOS用でLinuxではサポートしていないようなのでoptionalを無視してやれば良いらしい

実行結果

> node-sass@4.5.3 install /home/public/app/node_modules/node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.5.3/linux-x64-57_binding.node
Download complete .] - :
Binary saved to /home/public/app/node_modules/node-sass/vendor/linux-x64-57/binding.node
Caching binary to /root/.npm/node-sass/4.5.3/linux-x64-57_binding.node

> uglifyjs-webpack-plugin@0.4.6 postinstall /home/public/app/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js


> node-sass@4.5.3 postinstall /home/public/app/node_modules/node-sass
> node scripts/build.js

Binary found at /home/public/app/node_modules/node-sass/vendor/linux-x64-57/binding.node
Testing binary
Binary is fine

> gifsicle@3.0.4 postinstall /home/public/app/node_modules/gifsicle
> node lib/install.js

  ✔ gifsicle pre-build test passed successfully

> mozjpeg@4.1.1 postinstall /home/public/app/node_modules/mozjpeg
> node lib/install.js

  ⚠ The `/home/public/app/node_modules/mozjpeg/vendor/cjpeg` binary doesn't seem to work correctly
  ⚠ mozjpeg pre-build test failed
  ℹ compiling from source
  ✖ Error: autoreconf -fiv && ./configure --disable-shared --prefix="/home/public/app/node_modules/mozjpeg/vendor" --bindir="/home/public/app/node_modules/mozjpeg/vendor" --libdir="/home/public/app/node_modules/mozjpeg/vendor" && make --jobs=1 && make install --jobs=1
Command failed: ./configure --disable-shared --prefix="/home/public/app/node_modules/mozjpeg/vendor" --bindir="/home/public/app/node_modules/mozjpeg/vendor" --libdir="/home/public/app/node_modules/mozjpeg/vendor"
./configure: line 2272: cannot create temp file for here-document: Text file busy
./configure: line 2284: cannot create temp file for here-document: Text file busy
./configure: line 2319: cannot create temp file for here-document: Text file busy
./configure: line 2481: cannot create temp file for here-document: Text file busy
./configure: line 2485: cannot create temp file for here-document: Text file busy
./configure: line 2489: cannot create temp file for here-document: Text file busy
./configure: line 2493: cannot create temp file for here-document: Text file busy
./configure: line 2497: cannot create temp file for here-document: Text file busy
./configure: line 2501: cannot create temp file for here-document: Text file busy
./configure: line 3047: cannot create temp file for here-document: Text file busy
./configure: line 3144: cannot create temp file for here-document: Text file busy
./configure: line 3149: cannot create temp file for here-document: Text file busy
./configure: line 3242: cannot create temp file for here-document: Text file busy
./configure: line 3627: cannot create temp file for here-document: Text file busy
sed: can't read conftest.c: No such file or directory
configure: error: in `/home/public/app/node_modules/mozjpeg/6fe84e84-0911-4ba1-a3cc-949fb728affc':
configure: error: C compiler cannot create executables
See `config.log' for more details

    at ChildProcess.exithandler (child_process.js:270:12)
    at emitTwo (events.js:125:13)
    at ChildProcess.emit (events.js:213:7)
    at maybeClose (internal/child_process.js:897:16)
    at Socket.stream.socket.on (internal/child_process.js:340:11)
    at emitOne (events.js:115:13)
    at Socket.emit (events.js:210:7)
    at Pipe._handle.close [as _onclose] (net.js:549:12)

> optipng-bin@3.1.4 postinstall /home/public/app/node_modules/optipng-bin
> node lib/install.js

  ✔ optipng pre-build test passed successfully

> pngquant-bin@3.1.1 postinstall /home/public/app/node_modules/pngquant-bin
> node lib/install.js

  ⚠ The `/home/public/app/node_modules/pngquant-bin/vendor/pngquant` binary doesn't seem to work correctly
  ⚠ pngquant pre-build test failed
  ℹ compiling from source
  ✔ pngquant built successfully
npm notice created a lockfile as package-lock.json. You should commit this file.
added 1178 packages in 272.894s

mozjpeg pre-build test failedが気になるが通ったので放置

cross-envコマンド追加
sh: cross-env: command not foundになるので

# npm install -g cross-env

/usr/local/nvm/versions/node/v8.1.4/bin/cross-env -> /usr/local/nvm/versions/node/v8.1.4/lib/node_modules/cross-env/dist/bin/cross-env.js
/usr/local/nvm/versions/node/v8.1.4/bin/cross-env-shell -> /usr/local/nvm/versions/node/v8.1.4/lib/node_modules/cross-env/dist/bin/cross-env-shell.js
+ cross-env@5.0.5
added 10 packages in 1.805s

Laravel Mix実行

# npm run dev

> @ dev /home/public/app
> npm run development


> @ development /home/public/app
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

 95% emitting

 DONE  Compiled successfully in 13920ms                                                                                                          00:12:00
                                                                                                                                                                                                                                                Asset     Size  Chunks                    Chunk Names
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.eot?f4769f9bdb7466be65088239c12046d1  20.1 kB          [emitted]
fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb    18 kB          [emitted]
 fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff?fa2772327f55d8198301fdb8bcfc8158  23.4 kB          [emitted]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.ttf?e18bbf611f2a2e43afc071aa2f4e1512  45.4 kB          [emitted]
  fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.svg?89889688147bd7575d6327160d64e760   109 kB          [emitted]
                                                                                               /js/app.js   1.2 MB       0  [emitted]  [big]  /js/app
                                                                                             /css/app.css   147 kB       0  [emitted]         /js/app