opcodesio / log-viewer

Fast and beautiful Log Viewer for Laravel
https://log-viewer.opcodes.io
MIT License
3.49k stars 250 forks source link

No errors, but page does not format correctly #268

Closed ksorbo closed 8 months ago

ksorbo commented 1 year ago

It looks as if both the app.js and the app.css are loading, but the page does not format correctly on initial load. The images are display full screen. logviewer2

I have republished the assets (php artisan log-viewer:publish) several times, but it doesn't seem to make a difference.

Is there some way to completely refresh the assets?

logviewer

arukompas commented 1 year ago

Hey @ksorbo it could also be errors in the console. Are there any? Perhaps the script fails to load.

Otherwise, you could try clearing public/vendor/log-viewer and then publishing again.

ksorbo commented 1 year ago

No errors in the browser console. Thanks. I will try to clear that folder..

On Wed, Aug 23, 2023 at 10:19 PM Arunas Skirius @.***> wrote:

Hey @ksorbo https://github.com/ksorbo it could also be errors in the console. Are there any? Perhaps the script fails to load.

Otherwise, you could try clearing public/vendor/log-viewer and then publishing again.

— Reply to this email directly, view it on GitHub https://github.com/opcodesio/log-viewer/issues/268#issuecomment-1690931241, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAK6ZVDJ2FZPM2ALFH3PNODXW3B2JANCNFSM6AAAAAA34HTHUE . You are receiving this because you were mentioned.Message ID: @.***>

ksorbo commented 1 year ago

Any other ideas?

I have cleared the public/vendor/log-viewer folder completely and then republished the assets.

I continue to get the same problem as posted above.

ksorbo commented 1 year ago

I upgraded to latest version 3.x Cleared the public/vendor/log-viewer Published assets Cleared cache, hard reset Still get the same error.

arukompas commented 1 year ago

@ksorbo hey, How are you serving the app? Artisan serve, Valet, Xampp, something else?

Try a different serving method, like php artisan serve just to see if that fixes the issues. Perhaps the assets are not being served correctly.

ksorbo commented 1 year ago

I am having problems on my staging/production server. (When I serve on my development site using local windows machine using laravel homestead, it works ok.)

The server is using Ubuntu 22.10, php 8.1.7, apache2 2.4.54, laravel 10.19, log-viewer 3.1.3

I am getting 200 on all resources as shown in the attached graphic. When I open the js and css files, they both have full compressed content.

No errors showing in the console. I have manually cleared the /public/vendor/log-viewer folder and re published several times.

It seems like code is working correctly, but it looks as if the tailwind classes are not taking effect even though the css file is clearly loading (200). Here is the css file that is loading: https://staging2023.discipleshipdynamics.com/vendor/log-viewer/app.css?id=93151d8b186ef7758df8582425ff8082

You can see that tailwind is clearly loading. The class .w-5 is searchable in the css file. But when viewed in the inspector, the w-5 h-5 classes are not having any effect.

The following is from my staging server. Debug-bar is also on this server. However, I am getting the same problem on the production server which does not have debug-bar present. image

arukompas commented 1 year ago

@ksorbo we're getting closer! Thanks for the staging link, this helped me find something.

The file is being served as regular text/html content-type, which means although the browser receives it - it does not treat it like a CSS file. The same happens to the app.js file, which is why it's received but never loaded.

Have a look here:

Screenshot 2023-09-23 at 09 47 40

Something must be off with the way static assets are served on your staging/prod server. Please double-check your apache virtual host config, or the .htaccess file. I'm not exactly sure if there's anything in there that would change the content type of these files.

MoatazAbdAlmageed commented 10 months ago

I injected the css but got this >>

image
MoatazAbdAlmageed commented 10 months ago

I injected the css but got this >> image

I uses stylebot to do that

image
MoatazAbdAlmageed commented 10 months ago

I injected the css but got this >> image

I uses stylebot to do that image

now it's

image
MoatazAbdAlmageed commented 10 months ago

from firefox I got this error

image
MoatazAbdAlmageed commented 10 months ago

is this ok ?

image
arukompas commented 10 months ago

@MoatazAbdAlmageed , like mentioned in above comments, it's not ok that your CSS files are being served with content type of text/plain. The browser does not know it's a CSS file and thus it does not render it.

You probably have the same problem with the JS file - it should have the content type of application/javascript , otherwise the browser will not process it.

You should look at your server setup and how it serves static assets like JS and CSS.

ksorbo commented 8 months ago

I have confirmed that the problem was with my Apache server incorrectly serving the css files.

Thanks.