最新の Laravel 5.6.7 + PHP 7.1.15で Vueの環境を構築している際に、npm installが出来ずに半日程度費やした際の備忘録。Laravelそのものの問題ではないがこれが解決しないと Vue.jsの開発が出来ないので。

環境:

[root@localhost nginx]# php -v
PHP 7.1.15 (cli) (built: Feb 28 2018 14:06:54) ( NTS )

[root@localhost app]# php artisan –version
Laravel Framework 5.6.7

[root@localhost app]# npm –version
5.6.0

[root@localhost app]# node –version
v8.9.4

Laravel ドキュメントをみながら “npm install”を実行。途中から次のようなエラー(警告)が永久ループ…
“gyp WARN EACCES user “root” does not have permission to access the dev dir “/usr/share/nginx/app/node_modules/node-sass/.node-gyp/8.9.4”.

[root@localhost app]# npm install
npm WARN deprecated gulp-util@3.0.8: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5

> node-sass@4.7.2 install /usr/share/nginx/app/node_modules/node-sass
> node scripts/install.js

Unable to save binary /usr/share/nginx/app/node_modules/node-sass/vendor/linux-x64-57 : { Error: EACCES: permission denied, mkdir '/usr/share/nginx/app/node_modules/node-sass/vendor'
    at Object.fs.mkdirSync (fs.js:885:18)
    at sync (/usr/share/nginx/app/node_modules/mkdirp/index.js:71:13)
    at Function.sync (/usr/share/nginx/app/node_modules/mkdirp/index.js:77:24)
    at checkAndDownloadBinary (/usr/share/nginx/app/node_modules/node-sass/scripts/install.js:111:11)
    at Object.<anonymous> (/usr/share/nginx/app/node_modules/node-sass/scripts/install.js:154:1)
    at Module._compile (module.js:643:30)
    at Object.Module._extensions..js (module.js:654:10)
    at Module.load (module.js:556:32)
    at tryModuleLoad (module.js:499:12)
    at Function.Module._load (module.js:491:3)
  errno: -13,
  code: 'EACCES',
  syscall: 'mkdir',
  path: '/usr/share/nginx/app/node_modules/node-sass/vendor' }

> uglifyjs-webpack-plugin@0.4.6 postinstall /usr/share/nginx/app/node_modules/we
bpack/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js


> node-sass@4.7.2 postinstall /usr/share/nginx/app/node_modules/node-sass
> node scripts/build.js

Building: /usr/bin/node /usr/share/nginx/app/node_modules/node-gyp/bin/node-gyp.
js rebuild --verbose --libsass_ext= --libsass_cflags= --libsass_ldflags= --libsa
ss_library=
gyp info it worked if it ends with ok
gyp verb cli [ '/usr/bin/node',
gyp verb cli   '/usr/share/nginx/app/node_modules/node-gyp/bin/node-gyp.js',
gyp verb cli   'rebuild',
gyp verb cli   '--verbose',
gyp verb cli   '--libsass_ext=',
gyp verb cli   '--libsass_cflags=',
gyp verb cli   '--libsass_ldflags=',
gyp verb cli   '--libsass_library=' ]
gyp info using node-gyp@3.6.2
gyp info using node@8.9.4 | linux | x64
gyp verb command rebuild []
gyp verb command clean []
gyp verb clean removing "build" directory
gyp verb command configure []
gyp verb check python checking for Python executable "python2" in the PATH
gyp verb `which` succeeded python2 /bin/python2
gyp verb check python version `/bin/python2 -c "import platform; print(platform.python_version());"` returned: "2.7.5\n"
gyp verb get node dir no --target version specified, falling back to host node version: 8.9.4
gyp verb command install [ '8.9.4' ]
gyp verb install input version string "8.9.4"
gyp verb install installing version: 8.9.4
gyp verb install --ensure was passed, so won't reinstall if already installed
gyp WARN EACCES user "root" does not have permission to access the dev dir "/root/.node-gyp/8.9.4"
gyp WARN EACCES attempting to reinstall using temporary dev dir "/usr/share/nginx/app/node_modules/node-sass/.node-gyp"
gyp verb tmpdir == cwd automatically will remove dev files after to save disk space
gyp verb command install [ '8.9.4' ]
gyp verb install input version string "8.9.4"
gyp verb install installing version: 8.9.4
gyp verb install --ensure was passed, so won't reinstall if already installed
gyp verb install version not already installed, continuing with install 8.9.4
gyp verb ensuring nodedir is created /usr/share/nginx/app/node_modules/node-sass/.node-gyp/8.9.4
gyp WARN EACCES user "root" does not have permission to access the dev dir "/usr/share/nginx/app/node_modules/node-sass/.node-gyp/8.9.4"
gyp WARN EACCES attempting to reinstall using temporary dev dir "/usr/share/nginx/app/node_modules/node-sass/.node-gyp"
gyp verb tmpdir == cwd automatically will remove dev files after to save disk space
gyp verb command install [ '8.9.4' ]
gyp verb install input version string "8.9.4"
gyp verb install installing version: 8.9.4
gyp verb install --ensure was passed, so won't reinstall if already installed
gyp verb install version not already installed, continuing with install 8.9.4
gyp verb ensuring nodedir is created /usr/share/nginx/app/node_modules/node-sass/.node-gyp/8.9.4
gyp WARN EACCES user "root" does not have permission to access the dev dir "/usr/share/nginx/app/node_modules/node-sass/.node-gyp/8.9.4"
gyp WARN EACCES attempting to reinstall using temporary dev dir "/usr/share/nginx/app/node_modules/node-sass/.node-gyp"
gyp verb tmpdir == cwd automatically will remove dev files after to save disk space
.
.
.

ここら を参考に何度か試してみると、いまく行った模様。

[root@localhost app]# rm -rf node_modules/
[root@localhost app]# npm install --unsafe-perm
[root@localhost app]# npm run dev
[root@localhost app]#

こちら を参考に vueのサンプルが動くように welcome.blade.phpを変更

[root@localhost app]# vi resources/views/welcome.blade.php

@extends('layouts.app')

@section('content')
    <example-component></example-component>
@endsection

http://192.168.33.10/ で確認、動いている模様。

ご参考までに😗