Level 104
You could compile the production build on local and push the compiled CSS and JS to the server.
In any case, npm run prod not npm run dev for production!
Mar 29, 2021
11
Level 15
Mix / NPM / Vue Problem: "The Mix manifest does not exist"
I am using Vue 2.0. Everything works on the dev server. I am now moving all my code to the production server on DigitalOcean, and Laravel gives the above error. Yes I have installed npm and I did npm run dev. This generates a raft of errors in the Terminal, all referring to permissions.
I have checked SO and there are so many suggestions, that I don't trust any of them. I have tried running sudo npm run dev to no avail. Is my only course to go through each and every file and mkdir on each one or is there some global solution?
Many Thanks!
npm run development
> development
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
Additional dependencies must be installed. This will only take a moment.
Running: npm install vue-template-compiler --save-dev --production=false
npm ERR! code EACCES
npm ERR! syscall mkdir
npm ERR! path /var/www/html/node_modules/vue-template-compiler
npm ERR! errno -13
npm ERR! Error: EACCES: permission denied, mkdir '/var/www/html/node_modules/vue-template-compiler'
npm ERR! { [Error: EACCES: permission denied, mkdir '/var/www/html/node_modules/vue-template-compiler']
npm ERR! stack:
npm ERR! 'Error: EACCES: permission denied, mkdir \'/var/www/html/node_modules/vue-template-compiler\'',
npm ERR! errno: -13,
npm ERR! code: 'EACCES',
npm ERR! syscall: 'mkdir',
npm ERR! path: '/var/www/html/node_modules/vue-template-compiler' }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It is likely you do not have the permissions to access this file as the current user
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/vince/.npm/_logs/2021-03-29T23_21_09_639Z-debug.log
/var/www/html/node_modules/webpack-cli/bin/cli.js:93
throw err;
^
Error: Command failed: npm install vue-template-compiler --save-dev --production=false
npm ERR! code EACCES
npm ERR! syscall mkdir
npm ERR! path /var/www/html/node_modules/vue-template-compiler
npm ERR! errno -13
npm ERR! Error: EACCES: permission denied, mkdir '/var/www/html/node_modules/vue-template-compiler'
npm ERR! { [Error: EACCES: permission denied, mkdir '/var/www/html/node_modules/vue-template-compiler']
npm ERR! stack:
npm ERR! 'Error: EACCES: permission denied, mkdir \'/var/www/html/node_modules/vue-template-compiler\'',
npm ERR! errno: -13,
npm ERR! code: 'EACCES',
npm ERR! syscall: 'mkdir',
npm ERR! path: '/var/www/html/node_modules/vue-template-compiler' }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It is likely you do not have the permissions to access this file as the current user
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/vince/.npm/_logs/2021-03-29T23_21_09_639Z-debug.log
Level 28
What happens if you run this yourself:
sudo npm install vue-template-compiler --save-dev --production=false
Does it work ?
Level 104
sudo npm install ... should never be the answer to any question.
Level 28
I 100% agree, but it's not like you're running it on a global npm install. It can be used to debug step by step. If everything runs fine, you can remove the node_modules folder and reinstall them properly without sudo, and then adjust permissions properly.
Level 15
Ok, I ran sudo npm install vue-template-compiler --s as suggested, and ran npm run prod and got:
vince@KidsClub:/var/www/html$ npm run prod
> prod
> npm run production
> production
> cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
(node:71773) UnhandledPromiseRejectionWarning: Error: EACCES: permission denied, open '/var/www/html/public/mix-manifest.json'
at Object.openSync (fs.js:443:3)
at Object.writeFileSync (fs.js:1194:35)
at File.write (/var/www/html/node_modules/laravel-mix/src/File.js:157:12)
at Manifest.refresh (/var/www/html/node_modules/laravel-mix/src/Manifest.js:78:14)
at compiler.plugin (/var/www/html/node_modules/laravel-mix/src/webpackPlugins/ManifestPlugin.js:12:43)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/html/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:7:1)
at AsyncSeriesHook.lazyCompileHook (/var/www/html/node_modules/tapable/lib/Hook.js:154:20)
at Compiler.emitAssets (/var/www/html/node_modules/webpack/lib/Compiler.js:491:19)
at onCompiled (/var/www/html/node_modules/webpack/lib/Compiler.js:278:9)
at hooks.afterCompile.callAsync.err (/var/www/html/node_modules/webpack/lib/Compiler.js:681:15)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/html/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook (/var/www/html/node_modules/tapable/lib/Hook.js:154:20)
at compilation.seal.err (/var/www/html/node_modules/webpack/lib/Compiler.js:678:31)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/html/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook (/var/www/html/node_modules/tapable/lib/Hook.js:154:20)
at hooks.optimizeAssets.callAsync.err (/var/www/html/node_modules/webpack/lib/Compilation.js:1423:35)
at AsyncSeriesHook.eval [as callAsync] (eval at create (/var/www/html/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
at AsyncSeriesHook.lazyCompileHook (/var/www/html/node_modules/tapable/lib/Hook.js:154:20)
at hooks.optimizeChunkAssets.callAsync.err (/var/www/html/node_modules/webpack/lib/Compilation.js:1414:32)
at _promise0.then._result0 (eval at create (/var/www/html/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
(node:71773) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
vince@KidsClub:/var/www/html$
Level 15
@piljac1 It looks like you altered your suggestion, so I have now tried your revised suggestion:
'sudo npm install vue-template-compiler --save-dev --production=false' and got:
vince@KidsClub:/var/www/html$ sudo npm install vue-template-compiler --save-dev --production=false
up to date, audited 1110 packages in 3s
found 0 vulnerabilities
Level 15
Curiously, the error messages say,
(node:71773) UnhandledPromiseRejectionWarning: Error: EACCES: permission denied, open '/var/www/html/public/mix-manifest.json'
However, mix-manifest.json does not exist
Level 28
I didn't alter my suggestion, which is weird.
But it looks like your user/group setup was not done properly. Look at the following, which will most likely help you fixing these permission errors : https://stackoverflow.com/a/37266353
1 like
Level 15
Progress!!
I ran 'npm run prod' and got no errors, also I got compiled successfully
Now, only 2 things left:
My CSS has not come through. And my Vue Template has not come through.
Level 1
Don't worry! In my situation, file permissions had caused the problem with using these commands: chown -R www-data:www-data /your/laravel_path or you can use your username instead of www-data (it's for Nginx)
Level 1
I am using Docker, and I also encountered this issue. After setting USER www-data in the Dockerfile, everything worked.
1 like
Please or to participate in this conversation.