Help us understand the problem. What is going on with this article?

Nuxt.jsインストールでハマった

ローカル環境

  • MacOS High Sierra
  • Node.js 12.4.0
  • npm 6.9.0

npx create-nuxt-appでエラー

仕事でNuxt使い始めたけど自宅でも勉強したいなと思い、開発環境整えることに。
早速インストールすると、

$ npx create-nuxt-app my-project
create-nuxt-app v2.10.1
✨  Generating Nuxt.js project in my-project
...
gyp ERR! configure error 
gyp ERR! stack Error: Command failed: /Users/user/anaconda3/bin/python -c import sys; print "%s.%s.%s" % sys.version_info[:3];
...
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
...
SAOError: Failed to install packages in /Users/user/practice/Nuxt/my-project
    at ChildProcess.<anonymous> (/Users/shun/.npm/_npx/17703/lib/node_modules/create-nuxt-app/node_modules/sao/lib/installPackages.js:108:15)
    at ChildProcess.emit (events.js:200:13)
    at maybeClose (internal/child_process.js:1021:16)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:283:5) {
  __sao: true
}

会社のPCではスムーズにインストールできたのに、gyp ERRnpm ERRSAOErrorとエラートリプルコンボでハマりました。
しかもSAOErrorとか単体で調べても50件くらいしかヒットしない。

npm install --saveでも同じエラーに

なんぞやーと思ってNodeやnpmのサポートバージョン見ても問題ないので、npm内部の問題なのかと思ってnpm listで調べると、

$ npm list
...
│ ├── which-module@1.0.0
│ ├── window-size@0.2.0
│ ├── y18n@3.2.1
│ └─┬ yargs-parser@2.4.1
│   ├── camelcase@3.0.0
│   └── lodash.assign@4.2.0 deduped
└── zeppelin-solidity@1.12.0

npm ERR! extraneous: aes-js@3.1.2 /Users/shun/node_modules/ethereumjs-wallet/node_modules/aes-js
npm ERR! extraneous: bs58check@2.1.2 /Users/shun/node_modules/ethereumjs-wallet/node_modules/bs58check
npm ERR! extraneous: ethereumjs-util@6.1.0 /Users/shun/node_modules/ethereumjs-wallet/node_modules/ethereumjs-util
npm ERR! extraneous: hdkey@1.1.1 /Users/shun/node_modules/ethereumjs-wallet/node_modules/hdkey
npm ERR! extraneous: randombytes@2.1.0 /Users/shun/node_modules/ethereumjs-wallet/node_modules/randombytes
npm ERR! extraneous: utf8@3.0.0 /Users/shun/node_modules/ethereumjs-wallet/node_modules/utf8
npm ERR! extraneous: uuid@3.3.2 /Users/shun/node_modules/ethereumjs-wallet/node_modules/uuid
npm ERR! extraneous: scryptsy@1.2.1 /Users/shun/node_modules/scrypt.js/node_modules/scryptsy
npm ERR! extraneous: require-from-string@2.0.2 /Users/shun/node_modules/solc/node_modules/require-from-string
npm ERR! extraneous: yargs@11.1.0 /Users/shun/node_modules/solc/node_modules/yargs
...

エラーが表示されてる。
npm installするときに--saveオプションつけないとpackage.jsondependenciesに追加されず、このようなエラーを起こすみたい。
対処法として、とりあえずオプションつけてインストールしてみる。

$ npm install --save hoge fuga ...

> scrypt@6.0.3 preinstall /Users/user/node_modules/scrypt
> node node-scrypt-preinstall.js


> scrypt@6.0.3 install /Users/user/node_modules/scrypt
> node-gyp rebuild


gyp ERR! configure error 
gyp ERR! stack Error: Command failed: /Users/shun/anaconda3/bin/python -c import sys; print "%s.%s.%s" % sys.version_info[:3];
gyp ERR! stack   File "<string>", line 1
gyp ERR! stack     import sys; print "%s.%s.%s" % sys.version_info[:3];
...

Nuxtインストールしたときと同じエラーが。
どうやらanacondaのPythonが邪魔をしていたらしい。

原因はAnaconda

とりあえずanacondaをアンインストール。

$ conda install anaconda-clean
$ anaconda-clean
$ rm -fr ~/.anaconda_backup
$ rm -fr /anaconda3
$ vi ~/.bash_profile  # anacondaのPATHを削除

再度npx create-nuxt-app

ターミナルのタブ切り替えて、再度インストールコマンドを叩く。

$ npx create-nuxt-app my-project
...
🎉  Successfully created project my-project

  To get started:

    cd my-project
    npm run dev

  To build & start for production:

    cd my-project
    npm run build
    npm run start

本当はanacondaアンインストールせずにできれば良かったけど、なんかめんどくさそうだったので次善策としてアンインストールしました。
何はともあれこれでやっとローカルで勉強できる。。

参考

npm listで表示される”extraneous”
node.jsの依存ライブラリを整理してみた
Anaconda3をmacOSから完全にアンインストールする方法

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away