Laravel и Vite в контейнере Docker ⇐ Javascript

[Anonymous]

Я пытаюсь контейнеризировать проект laravel, который будет работать под управлением vue, так как веб-пакет теперь не является стандартом, а Vite - таковым, для меня при запуске Vite он будет обновляться, если что-то в проекте изменилось.
У меня npm работает в другом сервисе, он запускается только при необходимости, и когда я запускаю npm run dev, запускается сервер разработки Vite, и это здорово, но я обнаружил, что он ничего не замечает.
Мой файл создания докера:

Код: Выделить всё

ervices:
nginx:
#image: nginx:stable-apline
build:
context: .
ports:
- 80:80
volumes:
- ./src:/var/www/html

depends_on:
- mysql
- php
mysql:
image: mariadb:10.5.8
ports:
- 3306:3306
environment:
MYSQL_DATABASE: laravel
MYSQL_USER: laravel
MYSQL_PASSWORD: secret
MYSQL_ROOT_PASSWORD: secret
volumes:
- ./mysql:/var/lib/mysql

php:
build:
context: .
dockerfile: php.dockerfile
volumes:
- ./src:/var/www/html

composer:
build:
context: .
dockerfile: composer.dockerfile
volumes:
- ./src:/var/www/html
working_dir: /var/www/html

node:
image: node:current-alpine
volumes:
- ./src:/var/www/html
entrypoint: ["npm"]
working_dir: /var/www/html

Когда мой контейнер nginx запущен, я получаю в консоли следующее:


Моя конфигурация Vite выглядит следующим образом:

Код: Выделить всё

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import tailwindcss from '@tailwindcss/vite';
import vue from '@vitejs/plugin-vue';

export default defineConfig({
server: {
strictPort: true,
port: 5173,
host: '127.0.0.1',
origin: 'http://localhost:5173',
hmr: {
host: 'localhost',
},
watch: {
usePolling: true
}
},
plugins: [
laravel({
input: ['resources/css/app.css', 'resources/js/app.js'],
refresh: true,
}),
tailwindcss(),
vue()
]
});

это Welcome.blade.php

Код: Выделить всё

{{ config('app.name', 'Laravel') }}






@vite(['resources/css/app.css', 'resources/js/app.js'])

Файл app.js:

Код: Выделить всё

import './bootstrap';

import {createApp} from "vue/dist/vue.esm-bundler.js";
import HomeComponent from "./components/HomeComponent.vue";

const app = createApp({});

app.component('HomeComponent', HomeComponent);

app.mount('#app');

Ошибки консоли не отображаются только в том случае, если я удалю горячий файл в общедоступном разделе, но мне все равно не удается отобразить мой компонент.
Есть мысли?>

Подробнее здесь: https://stackoverflow.com/questions/798 ... -container