CaptainJackas's avatar

npm run dev not compiling app.scss

Hi all,

I just created a new Laravel project and I keep running into the following problem. Whenever I execute the npm run dev and I reload the page, it keeps loading and eventually the app.scss is returning ERR_EMPTY_RESPONSE after like 5 min, whereas the app.js is generated and loaded just fine. Funny thing is, when I reload the page and after that I hit q+enter in the command prompt, the css suddenly starts compiling before the server stops! npm run build also runs without a problem so there shouldn't be anything wrong with the file.

After running npm run dev this is the response:

  VITE v7.1.12  ready in 1196 ms

  ➜  Network: http://192.168.30.26:5173/
  ➜  press h + enter to show help

  LARAVEL v12.37.0  plugin v2.0.1

  ➜  APP_URL: http://192.168.30.26:8000

With vite.config.js:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    server: {
        host: '192.168.30.26',
        port: 5173,
        watch: {
            usePolling: true
        },
        hmr: {
            host: '192.168.30.26',
        },
    },
    plugins: [
        laravel({
            input: [
                'resources/js/jquery.js',
                'resources/js/app.js',
                'resources/sass/app.scss',
            ],
            refresh: true,
        }),
    ]
});

Can anyone help me out here?

0 likes
2 replies
JussiMannisto's avatar

Is there some syntax error in the SCSS file? Is the CSS built correctly when your run run run build?

Please or to participate in this conversation.