styles not showing with vite

I moved my views over to a fresh Laravel 10 install, in my resources folder I have js/app.js, js/bootstrap.js and sass/app.scss

I edited my bootstrap file with

 window._ = require("lodash");
 /**
 * We'll load the axios HTTP library which allows us to easily issue requests
  * to our Laravel back-end. This library automatically handles sending the
  * CSRF token as a header based on the value of the "XSRF" token cookie.
  */
 try {
    window.Popper = require("@popperjs/core");
   window.$ = window.jQuery = require("jquery");

   window.bootstrap = require("bootstrap");
 } catch (e) {}

 import axios from "axios";
 window.axios = axios;

 window.axios.defaults.headers.common["X-Requested-With"] = "XMLHttpRequest";

and installed the relative plugins via npm

I updated my vite config

 export default defineConfig({
 plugins: [
 laravel({
  input: ["resources/sass/app.scss", "resources/js/app.js"],
  refresh: true,
   }),
  ],
 });

However, when I add @vite(['resources/css/app.css', 'resources/js/app.js']) to app.blade the page loads with no styles applied, its only working with

any idea why its not working?