Thiết kế website giá rẻ

Question

I have a Laravel 10 website hosted on Hostinger. The website works well, I can view the welcome page, but as soon as I enter a page with

@section('styles')
  @vite('resources/scss/partials/views/register.scss')
@endsection

or any another scss file, it gives me the error “Unable to locate file in Vite manifest: [path to the file].”

The files are in the file manager, at the right path because on my local machine I don’t have any problem.

I can’t run any npm command in the SSH console because on Hostinger node.js is available only on VPS and I don’t have it on my subscription.

Context

This is my vite.config.js file:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import path from 'path'; // <-- require path from node

export default defineConfig({
    plugins: [
        laravel({
            // edit the first value of the array input to point to our new sass files and folder.
            input: ['resources/scss/app.scss', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
    // Add resolve object and aliases
    resolve: {
        alias: {
            '~icons': path.resolve(__dirname, 'node_modules/bootstrap-icons/font'),
            '~bootstrap': path.resolve(__dirname, 'node_modules/bootstrap'),
            '~resources': '/resources/'
        }
    }
});

This is my layout app.blade.php:

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">

  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- CSRF Token -->
    <meta name="csrf-token" content="{{ csrf_token() }}">

    <title>{{ config('app.name', 'Travelog') }}</title>

    {{-- Manifest Link --}}
    <link rel="manifest" href="/manifest.json">

    {{-- Google Place CDN --}}
    <script async defer
      src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY&libraries=places"></script>

    <!-- Favicon -->
    <link rel="icon" href="{{ asset('favicon.ico') }}" type="image/x-icon">

    <!-- Fonts -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link
      href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
      rel="stylesheet">

    {{-- Google Icons --}}
    <link rel="stylesheet"
      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,[email protected],100..700,0..1,-50..200" />

    <!-- Registrazione del Service Worker -->
    <script>
      navigator.serviceWorker.register('/service-worker.js')
  .then(function(registration) {
    console.log('Service Worker registrato con successo:', registration.scope);
  })
  .catch(function(error) {
    console.log('Service Worker registrazione fallita:', error);
  });
    </script>

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

    <!-- Include global styles -->
    @vite('resources/scss/app.scss')

    <!-- Include page-specific styles -->
    @yield('styles')

    <!-- Include page-specific scripts -->
    @yield('scripts')
  </head>

  <body>
    <div id="app">
      <main class="">
        @yield('content')
      </main>
    </div>
  </body>

</html>

This is my manifest.json file in the public/build folder:

{
  "node_modules/bootstrap-icons/font/fonts/bootstrap-icons.woff": {
    "file": "assets/bootstrap-icons-BOrJxbIo.woff",
    "src": "node_modules/bootstrap-icons/font/fonts/bootstrap-icons.woff"
  },
  "node_modules/bootstrap-icons/font/fonts/bootstrap-icons.woff2": {
    "file": "assets/bootstrap-icons-BtvjY1KL.woff2",
    "src": "node_modules/bootstrap-icons/font/fonts/bootstrap-icons.woff2"
  },
  "resources/js/app.js": {
    "file": "assets/app-Dk8q_3Hi.js",
    "name": "app",
    "src": "resources/js/app.js",
    "isEntry": true,
    "css": [
      "assets/app-CKoukFA-.css"
    ],
    "assets": [
      "assets/bootstrap-icons-BtvjY1KL.woff2",
      "assets/bootstrap-icons-BOrJxbIo.woff"
    ]
  },
  "resources/scss/app.scss": {
    "file": "assets/app-D3Es-J5b.css",
    "src": "resources/scss/app.scss",
    "isEntry": true
  }
}

Thanks in advance for your help.

I tried to run php artisan view:clear php artisan config:clear and php artisan optimize in the SSH console, but nothing happened.

Thiết kế website giá rẻ

Danh mục

Laravel 10 on Hostinger: Unable to locate file in Vite manifest: resources/scss/partials/views/homepage.scss