我正在尝试使用 Laravel 进行部署,我已经成功做到了,但是 Bootstrap 样式不起作用,我有一个名为 app.scss 的文件,它必须从其中获取 Bootstrap 导入和我应用的样式样式表,但我没有执行它。
version: '3'
services:
app:
build:
context: .
dockerfile: Dockerfile
volumes:
- ./:/var/www/html
working_dir: /var/www/html
ports:
- "8000:8000"
- "8080:80"
expose:
- "80" #Esto tambien
- "8000" #Esto lo he añadido ahora
# dns:
# - 8.8.8.8
# - 8.8.4.4
depends_on:
- db
db:
image: mysql:5.7
environment:
MYSQL_DATABASE: bdevent
MYSQL_USER: j
MYSQL_PASSWORD: ****
MYSQL_ROOT_PASSWORD: ****
ports:
- "3306:3306"
volumes:
- db_data:/var/lib/mysql
volumes:
db_data:
我的 DockerFile:
FROM php:8.2
# Instalar extensiones y bibliotecas necesarias
RUN apt-get update && apt-get install -y \
zlib1g-dev \
libzip-dev \
libpng-dev \
nodejs npm \
&& rm -rf /var/lib/apt/lists/*
RUN npm install bootstrap
# Instalar extensiones PHP necesarias
RUN docker-php-ext-install bcmath gd zip pdo_mysql
# Copiar los archivos de la aplicación
COPY . /var/www/html
# Establecer el directorio de trabajo
WORKDIR /var/www/html
# Instalar dependencias de Composer y compilar estilos
RUN npm install && npm run build
# Ejecutar migraciones y seeders
#CMD ["php", "artisan", "migrate:fresh", "--seed"]
# Ejecutar migraciones y seeders
CMD ["bash", "-c", "php artisan migrate:fresh --seed && php artisan serve --host=0.0.0.0 --port=8000 "]
如果我访问网络,则会出现以下错误: 无法加载资源:net::ERR_CONNECTION_REFUSED 127.0.0.1:5173/@vite/客户端:1
Failed to load resource: net::ERR_CONNECTION_REFUSED
127.0.0.1:5173/resources/sass/app.scss:1
Failed to load resource: net::ERR_CONNECTION_REFUSED
127.0.0.1:5173/resources/js/bootstrap.js:1
这是我正在采用的基本模板,以便我的所有模板都继承自该模板,并带有blade和vite:
<html>
<head>
<link rel="icon" type="image/png" sizes="16x16"
href="img/favicon/favicon.png">
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/5.15.3/css/all.min.css" />
<link rel="stylesheet"href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"/>
<title>@yield('titulo')</title>
@vite(['resources/sass/app.scss',
'resources/js/bootstrap.js'])
</head>
<body>
<div>
@include('p_base/nav')
</div>
<div class="container mt-3 margin-top-navbar">
@yield('contenido')
<style>
body{
background-color: #393E41;
color: #E7E5DF;
}
</style>
</div>
</body>
</html>
检查资产路径: 更新基本模板中的这些行以使用 Laravel 的 asset helper 函数生成正确的 URL:
<link rel="stylesheet" href="{{ asset('path/to/bootstrap.min.css') }}" />
检查 Docker 容器端口: 确保您的 Docker 容器在正确的端口上运行。在 Docker Compose 文件中,您已将端口 8000 映射到主机和容器。确保您的 Laravel 应用程序配置为在端口 8000 上运行。
检查 Docker 网络配置: 错误
net::ERR_CONNECTION_REFUSED
表明存在网络问题。确保 Docker 容器内的 Laravel 应用程序配置为接受外部连接。检查 APP_URL
文件中 Laravel 应用程序的 .env
,并确保它对应于 Docker 容器的地址。
更新 npm 软件包: 在 Dockerfile 中,您将使用 npm 安装 Bootstrap。确保安装的 Bootstrap 版本与您的 Laravel 和其他依赖项兼容。您可能想尝试使用已知适合您的设置的特定版本。
更新 Dockerfile 中的相关行:
RUN npm install bootstrap@4
构建并清除缓存: 进行更改后,重建 Docker 容器并清除 Laravel 缓存:
docker-compose build
docker-compose up -d
docker-compose exec app php artisan config:cache
docker-compose exec app php artisan route:cache
调试: 如果问题仍然存在,您可以使用
docker-compose logs
检查容器日志中是否有任何错误消息。这可能会为您提供有关问题所在的更多信息。