npm run build different resource path

I'm installing Laravel Breeze Blade, so it comes with vite. I modified to import app.css into app.js

<!-- Scripts -->
@vite(['resources/js/app.js'])

Everything works in local, able to run dev and run build with the correct resource path. But once i try implement to live server, the href or src path is slightly different.

LOCAL : mydomain/build/assets/app-XXXX.css

DEV/PRODUCTION: public/build/assets/app-XXXX.css

so in dev/production the path will goes to wrong URL {production-domain}/public/build/assets/app-XXXX.css instead of {production-domain}/build/assets/app-XXXX.css which is the correct path for the file to access (test browsed the file code able to open)

Error from console:

Refused to apply style from '{production}/public/build/assets/app-XXX.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.Understand this errorAI
GET {production}/public/build/assets/app-XXX.js net::ERR_ABORTED 404 (Not Found)

NOTES that I've tried and still not working.

• I have ASSET_URL="XXX" in my .env
• No public/hot file
• My vite.config.js

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

export default defineConfig({
    server: {
        host: process.env.APP_URL,
    },
    plugins: [
        laravel({
            // input: ["resources/css/app.css", "resources/js/app.js"],
            input: ["resources/js/app.js"],
            refresh: true,
        }),
    ],
});