質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.37%
npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Laravel 5

Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

Q&A

解決済

1回答

31724閲覧

npm runすると、cross-env エラーがでる

KeisukeTaniai

総合スコア16

npm

npmは、Node Packaged Modulesの略。Node.jsのライブラリ・パッケージを管理できるツールです。様々なモジュールを簡単にインストールでき、自分でモジュールを作成し公開する際にも使用できます。

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

Laravel 5

Laravel 5は、PHPフレームワークLaravelの最新バージョンで、2014年11月に発表予定です。ディレクトリ構造がが現行版より大幅に変更されるほか、メソッドインジェクションやFormRequestの利用が可能になります。

0グッド

1クリップ

投稿2017/07/06 15:37

編集2017/07/06 15:38

質問

node.js初心者です。Laravelでvue.jsを利用しようと、nodeを使ってビルドしようとしています。

Laravelプロジェクトで、npm run devを実行すると、エラーが出てしまって上手くコンパイルできません。
どなたかご助言いただけると嬉しいです。

環境

php -v 5.6.0(7系に変更予定)
laravel -v 5.4.27

node -v v8.1.3
nodebrew -v 0.9.7

作業手順

laravel mixの立ち上げの為に、プロジェクトディレクトリで、nodebrewnode.jsをインストールした後、node inipackage.jsonを出力

以下の解決方法を元に、cross-envのディレクトリ指定を変更

https://github.com/JeffreyWay/laravel-mix/issues/478

{ "private": true, "scripts": { "dev": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "watch-poll": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --watch-poll --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js", "hot": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js", "production": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js" }, "devDependencies": { "axios": "^0.15.3", "bootstrap-sass": "^3.3.7", "cross-env": "^3.2.3", "jquery": "^3.1.1", "laravel-mix": "0.*", "lodash": "^4.17.4", "vue": "^2.1.10" }, }

ターミナルで、npm run devとすると、

> project-name@1.0.0 dev /Users/my-name/projects/docker_laravel/project-name > node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js internal/child_process.js:317 throw errnoException(err, 'spawn'); ^ Error: spawn EACCES at exports._errnoException (util.js:1022:11) at ChildProcess.spawn (internal/child_process.js:317:11) at Object.exports.spawn (child_process.js:491:9) at spawn (/Users/my-name/projects/docker_laravel/project-name/node_modules/cross-spawn/index.js:17:18) at crossEnv (/Users/my-name/projects/docker_laravel/project-name/node_modules/cross-env/dist/index.js:30:38) at Object.<anonymous> (/Users/my-name/projects/docker_laravel/project-name/node_modules/cross-env/dist/bin/cross-env.js:10:16) at Module._compile (module.js:569:30) at Object.Module._extensions..js (module.js:580:10) at Module.load (module.js:503:32) at tryModuleLoad (module.js:466:12) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! project-name@1.0.0 dev: `node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the project-name@1.0.0 dev 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! /Users/my-name/.npm/_logs/2017-07-06T15_00_33_864Z-debug.log

のようなエラーが出力され、
エラーログを見ると、

0 info it worked if it ends with ok 1 verbose cli [ '/Users/my-name/.nodebrew/node/v8.1.3/bin/node', 1 verbose cli '/Users/my-name/.nodebrew/current/bin/npm', 1 verbose cli 'run', 1 verbose cli 'dev' ] 2 info using npm@5.0.3 3 info using node@v8.1.3 4 verbose run-script [ 'predev', 'dev', 'postdev' ] 5 info lifecycle project-name@1.0.0~predev: project-name@1.0.0 6 silly lifecycle project-name@1.0.0~predev: no script for predev, continuing 7 info lifecycle project-name@1.0.0~dev: project-name@1.0.0 8 verbose lifecycle project-name@1.0.0~dev: unsafe-perm in lifecycle true 9 verbose lifecycle project-name@1.0.0~dev: PATH: /Users/my-name/.nodebrew/node/v8.1.3/lib/node_modules/npm/bin/node-gyp-bin:/Users/my-name/projects/docker_laravel/project-name/node_modules/.bin:/Users/my-name/.nodebrew/current/bin:/Users/my-name/.rbenv/shims:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/opt/X11/bin 10 verbose lifecycle project-name@1.0.0~dev: CWD: /Users/my-name/projects/docker_laravel/project-name 11 silly lifecycle project-name@1.0.0~dev: Args: [ '-c', 11 silly lifecycle 'node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js' ] 12 silly lifecycle project-name@1.0.0~dev: Returned: code: 1 signal: null 13 info lifecycle project-name@1.0.0~dev: Failed to exec dev script 14 verbose stack Error: project-name@1.0.0 dev: `node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js` 14 verbose stack Exit status 1 14 verbose stack at EventEmitter.<anonymous> (/Users/co_jp_ta/.nodebrew/node/v8.1.3/lib/node_modules/npm/lib/utils/lifecycle.js:283:16) 14 verbose stack at emitTwo (events.js:125:13) 14 verbose stack at EventEmitter.emit (events.js:213:7) 14 verbose stack at ChildProcess.<anonymous> (/Users/co_jp_ta/.nodebrew/node/v8.1.3/lib/node_modules/npm/lib/utils/spawn.js:40:14) 14 verbose stack at emitTwo (events.js:125:13) 14 verbose stack at ChildProcess.emit (events.js:213:7) 14 verbose stack at maybeClose (internal/child_process.js:897:16) 14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:208:5) 15 verbose pkgid project-name@1.0.0 16 verbose cwd /Users/my-name/projects/docker_laravel/project-name 17 verbose Darwin 16.6.0 18 verbose argv "/Users/my-name/.nodebrew/node/v8.1.3/bin/node" "/Users/co_jp_ta/.nodebrew/current/bin/npm" "run" "dev" 19 verbose node v8.1.3 20 verbose npm v5.0.3 21 error code ELIFECYCLE 22 error errno 1 23 error project-name@1.0.0 dev: `node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js` 23 error Exit status 1 24 error Failed at the project-name@1.0.0 dev script. 24 error This is probably not a problem with npm. There is likely additional logging output above. 25 verbose exit [ 1, true ]

このようになっております。
エラー箇所の指摘と、考えられる対応策を教えていただけると嬉しいです。
よろしくお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

https://laracasts.com/discuss/channels/javascript/sudden-npm-error

ここを見る限りではバージョンによる問題のようです。
一旦node_modulesディレクトリを削除して、再度インストールしてみてはどうでしょうか?

投稿2017/07/06 15:52

fagai

総合スコア2158

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

KeisukeTaniai

2017/07/08 02:32 編集

fagai様 ご回答ありがとうございます! node_modulesの再インストール後に、無事コンパイルが成功しました。 確かにバージョンの問題だったようです。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.37%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問