I have a laravel vue project working quite well in development but on the live shared hosting server, vue components are not showing up but the laravel views work just fine. There is no error in the console. I ran npm run production to minified for production before deploying and also set the vue.config mode to production. I've tried other few suggestions I found on here; Hot reload browser, clearing browser cache, trying another shared hosting server but none worked for me. Any help would be appreciated. Here is my script object in package.json file
Asked
Active
Viewed 1,137 times
0

Willydbd
- 39
- 1
- 8
-
As you say, production may not showing any error. Could you check when you are in development the console. You may have some warning that, if go in production, this will not work. – Patfreeze Sep 21 '21 at 12:52
-
Thank you @Patfreeze for your time. Yes, there's this error I get only in Chrome but not with Edge or Firefox. I read about it then, it has something to do with the extensions I'm running on chrome. Outside that, no other error. – Willydbd Sep 21 '21 at 13:36
-
No problem. If you can post an answer maybe this will help others in the same situation. – Patfreeze Sep 21 '21 at 17:43
2 Answers
0
So I discovered webpack was compiling to production with warnings that are not displaying. I got to know after adding this to my webpack.mix.js
mix.webpackConfig({
stats:{
hash: true,
children: true,
errors: true,
errorDetails: true,
warnings: true,
publicPath: true,
}
});
Thereafter fixed the warnings and boom problem solved.

Willydbd
- 39
- 1
- 8
0
My issue was an odd one, involving opacity. We had set the opacity to 99%
on the CSS selector for the given component, like so:
#component {
opacity: 99%;
}
When compiled and deployed in a docker container to Azure container apps, the CSS was set to 1%.
We changed the definition to:
#component {
opacity: 0.99;
}
Which seemed to work. I hope it helps someone out.

Thomas
- 550
- 5
- 17