在Laravel 5.4和Node.js上使用Laravel Mix Error编译资产

Question

To make npm globally I ran in the CLI: export PATH=/opt/plesk/node/7/bin:$PATH on Ubuntu (I have Plesk installed).

Without not much knowledge I ran npm run watch in the application path but I got several errors:

user@server:~/avisos.pagina$ npm run watch

@ watch /var/www/vhosts/pagina/avisos.pagina cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

sh: 1: cross-env: not found

npm ERR! Linux 4.9.36-x86_64-linode85

npm ERR! argv "/opt/plesk/node/7/bin/node" "/opt/plesk/node/7/bin/npm" "run" "watch"

npm ERR! node v7.4.0

npm ERR! npm v4.0.5

npm ERR! file sh

npm ERR! code ELIFECYCLE

npm ERR! errno ENOENT

npm ERR! syscall spawn

npm ERR! @ watch: cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

npm ERR! spawn ENOENT

npm ERR!

npm ERR! Failed at the @ watch script 'cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js'.

npm ERR! Make sure you have the latest version of node.js and npm installed.

npm ERR! If you do, this is most likely a problem with the package,

npm ERR! not with npm itself.

npm ERR! Tell the author that this fails on your system:

npm ERR! cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

npm ERR! You can get information on how to open an issue for this project with:

npm ERR! npm bugs

npm ERR! Or if that isn't available, you can get their info via:

npm ERR! npm owner ls

npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:

npm ERR! /var/www/vhosts/pagina/avisos.pagina/npm-debug.log

When I read /var/www/vhosts/pagina/avisos.pagina/npm-debug.log this is what I see:

0 info it worked if it ends with ok

1 verbose cli [ '/opt/plesk/node/7/bin/node',

1 verbose cli '/opt/plesk/node/7/bin/npm',

1 verbose cli 'bugs' ]

2 info using npm@4.0.5

3 info using node@v7.4.0

4 silly fetchPackageMetaData .

5 silly fetchDirectoryPackageData .

6 silly bugs url https://www.npmjs.org/package/

7 verbose stack Error: spawn xdg-open ENOENT

7 verbose stack at exports._errnoException (util.js:1022:11)

7 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32)

7 verbose stack at onErrorNT (internal/child_process.js:359:16)

7 verbose stack at _combinedTickCallback (internal/process/next_tick.js:74:11)

7 verbose stack at process._tickCallback (internal/process/next_tick.js:98:9)

8 verbose cwd /var/www/vhosts/pagina/avisos.pagina

9 error Linux 4.9.36-x86_64-linode85

10 error argv "/opt/plesk/node/7/bin/node" "/opt/plesk/node/7/bin/npm" "bugs"

11 error node v7.4.0

12 error npm v4.0.5

13 error path xdg-open

14 error code ENOENT

15 error errno ENOENT

16 error syscall spawn xdg-open

17 error enoent spawn xdg-open ENOENT

18 error enoent spawn xdg-open ENOENT

18 error enoent This is most likely not a problem with npm itself

18 error enoent and is related to npm not being able to find a file.

19 verbose exit [ 1, true ]

And now in my website I can see this instead the Laravel 5.4 website: https://i.imgur.com/Q8Su4K9.png

I've tried to run find /var/www/vhosts/pagina/avisos.pagina --name package.json and is not being found anywhere. Any ideas to compile assets with Laravel Mix without crashing the app or how to make this work? Thanks in advance!

Answer 1

Since you're running Ubuntu, odds are good the cross-env part of the command is tripping up your NPM. I've run into this issue numerous times and found removing cross-env (which, IIRC, is a fix/workaround for Windows boxes, so if you're not running Windows anywhere, it's not necessary) to fix it. Alternatively (or if you are running Windows), you should be able to install cross-env with npm install -g cross-env .

I've found it helpful to run the node commands directly when I run into problems, so I get the errors themselves. In this case:

cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

If my suspicion is correct, you'll want to convert it to:

NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

Things like npm run watch are simply shortcuts to these longer scripts. These shortcuts are declared in your package.json file (where you can also define your own script shortcuts if you want).