title: laravel 9 css not display properly
body: <p>I have create a new laravel 9 project and I have encounter an css and js assets connection  problem</p>
  <p>At first, I have run</p>
  <pre><code>php artisan serve 
  </code></pre>
  <p>to see if my project is working , and seems like everything is fine .
  <a href="https://i.stack.imgur.com/nJrI7.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/nJrI7.png" alt="enter image description here" /></a></p>
  <p>but when I just simply remove an part from the view , the css/js just get disabled to the view
  <a href="https://i.stack.imgur.com/rudu2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/rudu2.png" alt="enter image description here" /></a></p>
  <p>even I undo the changes , the css are still not working . did any know whats happen?</p>
  <p>here is my code for the css, and I believe it was properly connected</p>
  <pre><code>
      &lt;head&gt;
          
          &lt;meta charset=&quot;utf-8&quot; /&gt;
          &lt;title&gt;Admin Dashboard  &lt;/title&gt;
          &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
          &lt;meta content=&quot;Premium Multipurpose Admin &amp; Dashboard Template&quot; name=&quot;description&quot; /&gt;
          &lt;meta content=&quot;Themesdesign&quot; name=&quot;author&quot; /&gt;
          &lt;!-- App favicon --&gt;
          &lt;link rel=&quot;shortcut icon&quot; href=&quot;{{ asset('backend/assets/images/favicon.ico')}}&quot;&gt;
  
          &lt;!-- jquery.vectormap css --&gt;
          &lt;link href=&quot;{{ asset('backend/assets/libs/admin-resources/jquery.vectormap/jquery-jvectormap-1.2.2.css')}}&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot; /&gt;
  
          &lt;!-- DataTables --&gt;
          &lt;link href=&quot;{{ asset('backend/assets/libs/datatables.net-bs4/css/dataTables.bootstrap4.min.css')}}&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot; /&gt;
  
          &lt;!-- Responsive datatable examples --&gt;
          &lt;link href=&quot;{{ asset('backend/assets/libs/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css')}}&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot; /&gt;  
  
          &lt;!-- Bootstrap Css --&gt;
          &lt;link href=&quot;{{ asset('backend/assets/css/bootstrap.min.css')}}&quot; id=&quot;bootstrap-style&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot; /&gt;
          &lt;!-- Icons Css --&gt;
          &lt;link href=&quot;{{ asset('backend/assets/css/icons.min.css')}}&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot; /&gt;
          &lt;!-- App Css--&gt;
          &lt;link href=&quot;{{ asset('backend/assets/css/app.min.css')}}&quot; id=&quot;app-style&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot; /&gt;
  
      &lt;/head&gt;
  </code></pre>
  <pre><code>codes for vite.config.js
  
  import { defineConfig } from 'vite';
  import laravel from 'laravel-vite-plugin';
  
  export default defineConfig({
      plugins: [
          laravel({
              input: [
              'resources/css/app.css',
               'resources/js/app.js'
              ],
              refresh: true,
          }),
      ],
  });
  
  </code></pre>
  <p>I have already do some research and seems like it might be related to the &quot;vite&quot;, but It was something very strange to me . Could anyone tell me what should I do . Thank you in advance</p>