fix issue by CSP: forbids the use of unsafe-eval

[jkokotinis]

This is a fix for the issue described here

The issue can be reproduced by using the headers bellow at a docker container with a laravel project using the log-viewer:

            - "traefik.http.middlewares.traefik-headers.headers.referrerPolicy=no-referrer"
            - "traefik.http.middlewares.traefik-headers.headers.stsSeconds=315360000"
            - "traefik.http.middlewares.traefik-headers.headers.browserXSSFilter=true"
            - "traefik.http.middlewares.traefik-headers.headers.contentTypeNosniff=true"
            - "traefik.http.middlewares.traefik-headers.headers.forceSTSHeader=true"
            - "traefik.http.middlewares.traefik-headers.headers.stsIncludeSubdomains=true"
            - "traefik.http.middlewares.traefik-headers.headers.stsPreload=true"
            - "traefik.http.middlewares.traefik-headers.headers.customFrameOptionsValue=SAMEORIGIN"

The issue was occurred by the function
c = new Function("Vue", u)(r);
which was created during the building process in public/app.js.

The first change was in webpack.mix.js
'vue$': 'vue/dist/vue.runtime.esm-bundler.js', // ✅ ADD THIS LINE

This fixed the CSP issue.

The second change was in resources/js/app.js.
Some GPT info:

🔍 What's Causing the White Page

You’re doing this:

const app = createApp({
router,
});

That line does not define a render function or a component. Vue expects either:

A component with a render() or template

A component like App.vue

Because you’re not passing in a root component (like App.vue), Vue doesn’t know what to render — and with the runtime-only build, it can’t fall back to compiling anything. Hence the white page.

[arukompas]

That's amazing, thanks @jkokotinis ! 🎉

closing in favor of #448