NuxtでVuetify.jsを選んでHelloWorldしようとしたらうまくいかなかった。

2019年7月31日

何をしたか
NuxtインストールしてHelloWorldしようとしたけど、
うまくいかなかった記録。

っで、後日、結局なぜ上手くいかなかったか考えた。
たぶんだけど、yarnとかnpmのバージョンが古かった。
そんな流れで以下の記事を書いた。


以下で作業していく

C:\root\work\narou

Nuxtをインストール

cd narou
yarn install
yarn run dev

yarn install v1.13.0
info No lockfile found.
[1/4] Resolving packages...
warning nuxt > @nuxt/webpack > postcss-preset-env > postcss-color-functional-notation > postcss-values-parser > flatten@
1.0.2: I wrote this module a very long time ago; you should use something else.
warning eslint > file-entry-cache > flat-cache > circular-json@0.3.3: CircularJSON is in maintenance only, flatted is it
s successor.
[2/4] Fetching packages...
info fsevents@2.0.7: The platform "win32" is incompatible with this module.
info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.9: The platform "win32" is incompatible with this module.
info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > eslint-loader@2.2.1" has unmet peer dependency "webpack@>=2.0.0 <5.0.0".
[4/4] Building fresh packages...
success Saved lockfile.
Done in 148.75s.

やっぱyarnで全部やっていこう。

PS C:\root\work\narou> yarn create nuxt-app narou
yarn create v1.13.0
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@1.2.7: The platform "win32" is incompatible with this module.
info "fsevents@1.2.7" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning "@vue/cli > @vue/cli-ui > graphql-tag@2.10.1" has unmet peer dependency "graphql@^0.9.0 || ^0.10.0 || ^0.11.0 ||
 ^0.12.0 || ^0.13.0 || ^14.0.0".
warning "@vue/cli > @vue/cli-ui > graphql-type-json@0.2.1" has unmet peer dependency "graphql@>=0.8.0".
[4/4] Building fresh packages...

success Installed "create-nuxt-app@2.9.0" with binaries:
      - create-nuxt-app

create-nuxt-app v2.9.0
✨  Generating Nuxt.js project in narou
? Project name narou
? Project description My impeccable Nuxt.js project
? Author name Takumi Oda
? Choose the package manager Yarn
? Choose UI framework Vuetify.js
? Choose custom server framework None (Recommended)
? Choose Nuxt.js modules Axios
? Choose linting tools ESLint
? Choose test framework Jest
? Choose rendering mode Single Page App
warning nuxt > @nuxt/webpack > postcss-preset-env > postcss-color-functional-notation > postcss-values-parser > flatten
@1.0.2: I wrote this module a very long time ago; you should use something else.
warning jest > jest-cli > jest-config > jest-environment-jsdom > jsdom > left-pad@1.3.0: use String.prototype.padStart(
)
warning "babel-jest > babel-preset-jest > @babel/plugin-syntax-object-rest-spread@7.2.0" has unmet peer dependency "@ba
bel/core@^7.0.0-0".
warning "@nuxtjs/vuetify > vuetify-loader@1.3.0" has unmet peer dependency "vue-template-compiler@^2.5.0".
warning "@nuxtjs/vuetify > vuetify-loader@1.3.0" has unmet peer dependency "webpack@^4.0.0".
warning "@nuxtjs/vuetify > sass-loader@7.1.0" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".
warning "@nuxtjs/vuetify > vuetify@2.0.3" has unmet peer dependency "vue@^2.6.4".
warning "@nuxtjs/eslint-module > eslint-loader@2.2.1" has unmet peer dependency "webpack@>=2.0.0 <5.0.0".
warning " > @vue/test-utils@1.0.0-beta.29" has unmet peer dependency "vue@2.x".
warning " > @vue/test-utils@1.0.0-beta.29" has unmet peer dependency "vue-template-compiler@^2.x".
warning " > babel-jest@24.8.0" has unmet peer dependency "@babel/core@^7.0.0".
warning "babel-jest > babel-preset-jest@24.6.0" has unmet peer dependency "@babel/core@^7.0.0".
warning " > vue-jest@3.0.4" has unmet peer dependency "babel-core@^6.25.0 || ^7.0.0-0".
warning " > vue-jest@3.0.4" has unmet peer dependency "vue@^2.x".
warning " > vue-jest@3.0.4" has unmet peer dependency "vue-template-compiler@^2.x".
error C:\root\work\narou\narou\node_modules\fibers: Command failed.
Exit code: 1
Command: node build.js || nodejs build.js
Arguments:
Directory: C:\root\work\narou\narou\node_modules\fibers
Output:
C:\root\work\narou\narou\node_modules\fibers>if not defined npm_config_node_gyp (node "C:\Program Files\nodejs\node_mod
ules\npm\bin\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild --release )  else (node "" rebuild --re
lease )
gyp info it worked if it ends with ok
gyp info using node-gyp@3.8.0
gyp info using node@11.6.0 | win32 | x64
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack     at PythonFinder.failNoPython (C:\nvm\v11.6.0\node_modules\npm\node_modules\node-gyp\lib\configure.js
:484:19)
gyp ERR! stack     at PythonFinder.<anonymous> (C:\nvm\v11.6.0\node_modules\npm\node_modules\node-gyp\lib\configure.js:
509:16)
gyp ERR! stack     at C:\nvm\v11.6.0\node_modules\npm\node_modules\graceful-fs\polyfills.js:282:31
gyp ERR! stack     at FSReqCallback.oncomplete (fs.js:160:21)
gyp ERR! System Windows_NT 10.0.17134
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\nod
e-gyp\\bin\\node-gyp.js" "rebuild" "--release"
gyp ERR! cwd C:\root\work\narou\narou\node_modules\fibers
gyp ERR! node -v v11.6.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
node-gyp exited with code: 1
Please make sure you are using a supported platform and node version. If you
would like to compile fibers on this machine please make sure you have setup your
build environment--
Windows + OS X instructions here: https://github.com/nodejs/node-gyp
Ubuntu users please run: `sudo apt-get install g++ build-essential`
RHEL users please run: `yum install gcc-c++` and `yum groupinstall 'Development Tools'`
Alpine users please run: `sudo apk add python make g++`
'nodejs' �́A�����R�}���h�܂��͊O���R�}���h�A
����”\�ȃv���O�����܂��̓o�b�` �t�@�C���Ƃ��ĔF������Ă��܂���B

yarn install v1.13.0
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.0.7: The platform "win32" is incompatible with this module.
info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.9: The platform "win32" is incompatible with this module.
info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
[4/4] Building fresh packages...
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

C:\Users\xiaot\AppData\Local\Yarn\Data\global\node_modules\sao\lib\installPackages.js:108
        throw new SAOError(`Failed to install ${packageName} in ${cwd}`)
        ^

Error: Failed to install packages in C:\root\work\narou\narou
    at ChildProcess.ps.on.code (C:\Users\xiaot\AppData\Local\Yarn\Data\global\node_modules\sao\lib\installPackages.js:10
8:15)
    at ChildProcess.emit (events.js:188:13)
    at ChildProcess.cp.emit (C:\Users\xiaot\AppData\Local\Yarn\Data\global\node_modules\cross-spawn\lib\enoent.js:34:29)

    at maybeClose (internal/child_process.js:978:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:265:5)
error Command failed.
Exit code: 1
Command: C:\Users\xiaot\AppData\Local\Yarn\bin\create-nuxt-app
Arguments: narou
Directory: C:\root\work\narou
Output:

info Visit https://yarnpkg.com/en/docs/cli/create for documentation about this command.
PS C:\root\work\narou>

PS C:\root\work\narou> cd narou
PS C:\root\work\narou\narou> yarn install
yarn install v1.13.0
info No lockfile found.
[1/4] Resolving packages...
warning nuxt > @nuxt/webpack > postcss-preset-env > postcss-color-gray > postcss-values-parser > flatten@1.0.2: I wrote
this module a very long time ago; you should use something else.
warning jest > jest-cli > jest-config > jest-environment-jsdom > jsdom > left-pad@1.3.0: use String.prototype.padStart()

[2/4] Fetching packages...
info fsevents@2.0.7: The platform "win32" is incompatible with this module.
info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents@1.2.9: The platform "win32" is incompatible with this module.
info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning "babel-jest > babel-preset-jest > @babel/plugin-syntax-object-rest-spread@7.2.0" has unmet peer dependency "@bab
el/core@^7.0.0-0".
warning "@nuxtjs/vuetify > vuetify-loader@1.3.0" has unmet peer dependency "vue-template-compiler@^2.5.0".
warning "@nuxtjs/vuetify > vuetify-loader@1.3.0" has unmet peer dependency "webpack@^4.0.0".
warning "@nuxtjs/vuetify > sass-loader@7.1.0" has unmet peer dependency "webpack@^3.0.0 || ^4.0.0".
warning "@nuxtjs/vuetify > vuetify@2.0.3" has unmet peer dependency "vue@^2.6.4".
warning "@nuxtjs/eslint-module > eslint-loader@2.2.1" has unmet peer dependency "webpack@>=2.0.0 <5.0.0".
warning " > @vue/test-utils@1.0.0-beta.29" has unmet peer dependency "vue@2.x".
warning " > @vue/test-utils@1.0.0-beta.29" has unmet peer dependency "vue-template-compiler@^2.x".
warning " > babel-jest@24.8.0" has unmet peer dependency "@babel/core@^7.0.0".
warning "babel-jest > babel-preset-jest@24.6.0" has unmet peer dependency "@babel/core@^7.0.0".
warning " > vue-jest@3.0.4" has unmet peer dependency "babel-core@^6.25.0 || ^7.0.0-0".
warning " > vue-jest@3.0.4" has unmet peer dependency "vue@^2.x".
warning " > vue-jest@3.0.4" has unmet peer dependency "vue-template-compiler@^2.x".
[4/4] Building fresh packages...
[5/5] ⡀ nuxt
[-/5] ⡀ waiting...
[3/5] ⡀ fibers
[-/5] ⡀ waiting...
error C:\root\work\narou\narou\node_modules\fibers: Command failed.
Exit code: 1
Command: node build.js || nodejs build.js
Arguments:
Directory: C:\root\work\narou\narou\node_modules\fibers
Output:
C:\root\work\narou\narou\node_modules\fibers>if not defined npm_config_node_gyp (node "C:\Program Files\nodejs\node_modu
les\npm\bin\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild --release )  else (node "" rebuild --rele
ase )
gyp info it worked if it ends with ok
gyp info using node-gyp@3.8.0
gyp info using node@11.6.0 | win32 | x64
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack     at PythonFinder.failNoPython (C:\nvm\v11.6.0\node_modules\npm\node_modules\node-gyp\lib\configure.js:
484:19)
gyp ERR! stack     at PythonFinder.<anonymous> (C:\nvm\v11.6.0\node_modules\npm\node_modules\node-gyp\lib\configure.js:5
09:16)
gyp ERR! stack     at C:\nvm\v11.6.0\node_modules\npm\node_modules\graceful-fs\polyfills.js:282:31
gyp ERR! stack     at FSReqCallback.oncomplete (fs.js:160:21)
gyp ERR! System Windows_NT 10.0.17134
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\node_modules\\node
-gyp\\bin\\node-gyp.js" "rebuild" "--release"
gyp ERR! cwd C:\root\work\narou\narou\node_modules\fibers
gyp ERR! node -v v11.6.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
node-gyp exited with code: 1
Please make sure you are using a supported platform and node version. If you
would like to compile fibers on this machine please make sure you have setup your
build environment--
Windows + OS X instructions here: https://github.com/nodejs/node-gyp
Ubuntu users please run: `sudo apt-get install g++ build-essential`
RHEL users please run: `yum install gcc-c++` and `yum groupinstall 'Development Tools'`

yarn run dev
やったらエラーが出た。

PS C:\root\work\narou\narou> yarn run dev
yarn run v1.13.0
$ nuxt

 ERROR  ## There is an issue with node-fibers ##                                                              20:32:21
`C:\root\work\narou\narou\node_modules\fibers\bin\win32-x64-67\fibers.node` is missing.

Try running this to fix the issue: C:\Program Files\nodejs\node.exe C:\root\work\narou\narou\node_modules\fibers/build


 ERROR  C:\root\work\narou\narou\node_modules\fibers\fibers.js:1                                              20:32:21
Error: Cannot find module 'C:\\root\\work\\narou\\narou\\node_modules\\fibers\\bin\\win32-x64-67\\fibers'
Require stack:
- C:\root\work\narou\narou\node_modules\fibers\fibers.js
- C:\root\work\narou\narou\node_modules\@nuxtjs\vuetify\lib\module.js
- C:\root\work\narou\narou\node_modules\@nuxt\core\dist\core.js
- C:\root\work\narou\narou\node_modules\@nuxt\cli\dist\cli-chunk.js
- C:\root\work\narou\narou\node_modules\@nuxt\cli\dist\cli.js
- C:\root\work\narou\narou\node_modules\nuxt\bin\nuxt.js
    at Object.<anonymous> (C:\root\work\narou\narou\node_modules\fibers\fibers.js:14:39)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:732:10)


 FATAL  Missing binary. See message above.                                                                    20:32:21

  Error: Missing binary. See message above.
  at Object.<anonymous> (node_modules\fibers\fibers.js:23:9)
  at Object.Module._extensions..js (internal/modules/cjs/loader.js:732:10)
  at Object.Module._extensions..js (internal/modules/cjs/loader.js:732:10)


   ╭───────────────────────────────────────────────╮
   │                                               │
   │   ✖ Nuxt Fatal Error                          │
   │                                               │
   │   Error: Missing binary. See message above.   │
   │                                               │
   ╰───────────────────────────────────────────────╯

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

仕方がないのでnpm installすることにした。

PS C:\root\work\narou\narou> npm install
npm WARN deprecated left-pad@1.3.0: use String.prototype.padStart()
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\uglifyjs.cmd as it wasn't installed by C:\root\work\
narou\narou\node_modules\uglify-js
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\uglifyjs as it wasn't installed by C:\root\work\naro
u\narou\node_modules\uglify-js
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\semver.cmd as it wasn't installed by C:\root\work\na
rou\narou\node_modules\semver
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\semver as it wasn't installed by C:\root\work\narou\
narou\node_modules\semver
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\json5.cmd as it wasn't installed by C:\root\work\nar
ou\narou\node_modules\json5
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\json5 as it wasn't installed by C:\root\work\narou\n
arou\node_modules\json5
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\esvalidate.cmd as it wasn't installed by C:\root\wor
k\narou\narou\node_modules\esprima
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\esparse.cmd as it wasn't installed by C:\root\work\n
arou\narou\node_modules\esprima
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\esvalidate as it wasn't installed by C:\root\work\na
rou\narou\node_modules\esprima
npm WARN rm not removing C:\root\work\narou\narou\node_modules\.bin\esparse as it wasn't installed by C:\root\work\narou
\narou\node_modules\esprima

> fibers@4.0.1 install C:\root\work\narou\narou\node_modules\fibers
> node build.js || nodejs build.js


C:\root\work\narou\narou\node_modules\fibers>if not defined npm_config_node_gyp (node "C:\nvm\v11.6.0\node_modules\npm\n
ode_modules\npm-lifecycle\node-gyp-bin\\..\..\node_modules\node-gyp\bin\node-gyp.js" rebuild --release )  else (node "C:
\nvm\v11.6.0\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js" rebuild --release )
gyp ERR! configure error
gyp ERR! stack Error: Can't find Python executable "python", you can set the PYTHON env variable.
gyp ERR! stack     at PythonFinder.failNoPython (C:\nvm\v11.6.0\node_modules\npm\node_modules\node-gyp\lib\configure.js:
484:19)
gyp ERR! stack     at PythonFinder.<anonymous> (C:\nvm\v11.6.0\node_modules\npm\node_modules\node-gyp\lib\configure.js:5
09:16)
gyp ERR! stack     at C:\nvm\v11.6.0\node_modules\npm\node_modules\graceful-fs\polyfills.js:282:31
gyp ERR! stack     at FSReqCallback.oncomplete (fs.js:160:21)
gyp ERR! System Windows_NT 10.0.17134
gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\nvm\\v11.6.0\\node_modules\\npm\\node_modules\\node-gyp\\bin
\\node-gyp.js" "rebuild" "--release"
gyp ERR! cwd C:\root\work\narou\narou\node_modules\fibers
gyp ERR! node -v v11.6.0
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
node-gyp exited with code: 1
Please make sure you are using a supported platform and node version. If you
would like to compile fibers on this machine please make sure you have setup your
build environment--
Windows + OS X instructions here: https://github.com/nodejs/node-gyp
Ubuntu users please run: `sudo apt-get install g++ build-essential`
RHEL users please run: `yum install gcc-c++` and `yum groupinstall 'Development Tools'`
Alpine users please run: `sudo apk add python make g++`
'nodejs' は、内部コマンドまたは外部コマンド、
操作可能なプログラムまたはバッチ ファイルとして認識されていません。
npm WARN rollback Rolling back readable-stream@2.3.6 failed (this is probably harmless): EPERM: operation not permitted,
 lstat 'C:\root\work\narou\narou\node_modules\chokidar\node_modules\fsevents\node_modules'
npm WARN vue-jest@3.0.4 requires a peer of babel-core@^6.25.0 || ^7.0.0-0 but none is installed. You must install peer d
ependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\jest-haste-map\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any
"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.9 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.9: wanted {"os":"darwin","arch":"any
"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.0.7 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.0.7: wanted {"os":"darwin","arch":"any
"} (current: {"os":"win32","arch":"x64"})

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! fibers@4.0.1 install: `node build.js || nodejs build.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the fibers@4.0.1 install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\xiaot\AppData\Roaming\npm-cache\_logs\2019-07-31T13_25_06_214Z-debug.log

おいおい。HelloWorldも満足にできんかったぞ。どういうこっちゃ。
fibersがよろしくない感じだけど。。。
色々ネット巡って(その一例)、それでもうまくいかん。
でも、酒もいい感じに回ってきたので今日は終わり。