我有一个 Laravel 应用程序,其前端使用 Inertia.js 和 Vue.js 构建,并且我使用 Vite 作为资产捆绑器。当我在本地运行
vite build
时,应用程序会正确捆绑,包括所有资产。然而,当我尝试为应用程序构建 Docker 镜像时,Vite 仅捆绑了 app.js
和 app.css
,而忽略了其余资产。
这里是资源文件夹树:
resources
├── css
│ └── app.css
├── images
│ └── logo.png
└── js
├── app.js
└── pages
└── Quote
├── Create.vue
└── Show.vue
这里是预期的输出:
vite v4.4.7 building for production...
✓ 100 modules transformed.
public/build/manifest.json 1.24 kB │ gzip: 0.33 kB
public/build/assets/logo-fae5368c.png 2,792.47 kB
public/build/assets/Show-4ec4a01e.css 0.03 kB │ gzip: 0.05 kB
public/build/assets/app-c7d1a54e.css 7.29 kB │ gzip: 2.23 kB
public/build/assets/Create-742e3950.js 3.06 kB │ gzip: 1.20 kB
public/build/assets/Show-9b783249.js 3.90 kB │ gzip: 1.71 kB
public/build/assets/app-4b5ce87a.js 166.41 kB │ gzip: 59.79 kB
✓ built in 5.57s
这是使用 Docker 构建的当前结果:
vite v4.4.7 building for production...
✓ 95 modules transformed.
rendering chunks...
computing gzip size...
public/build/manifest.json 0.26 kB │ gzip: 0.13 kB
public/build/assets/app-179954eb.css 0.06 kB │ gzip: 0.06 kB
public/build/assets/app-1e574fbf.js 161.97 kB │ gzip: 57.94 kB
✓ built in 2.52s
这里
vite.config.js
:
import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';
import vue from '@vitejs/plugin-vue';
export default defineConfig({
plugins: [
laravel({
input: ['resources/css/app.css', 'resources/js/app.js'],
refresh: true,
}),
vue({
template: {
transformAssetUrls: {
base: null,
includeAbsolute: false,
},
},
}),
],
});
这里
Dockerfile
:
ARG composer_version=latest
ARG node_version=latest
ARG php_version=fpm
FROM php:$php_version as base
RUN \
apt-get update \
&& apt-get install -y \
libzip-dev \
&& apt-get clean \
&& rm -rf /var/lib/apt/lists/* \
&& docker-php-ext-install -j$(nproc) \
exif \
pdo_mysql \
zip
RUN cp /usr/local/etc/php/php.ini-production /usr/local/etc/php/php.ini
WORKDIR /var/www/html
FROM composer:$composer_version as composer
FROM base as vendor
COPY --from=composer /usr/bin/composer /usr/local/bin/composer
COPY composer.json composer.lock ./
ARG nova_email
ARG nova_password
RUN \
composer config --global http-basic.nova.laravel.com ${nova_email} ${nova_password} \
&& composer install \
--no-autoloader \
--no-dev \
--no-interaction \
--no-plugins \
--no-scripts \
--prefer-dist
COPY . .
RUN composer dumpautoload
FROM node:$node_version as build
WORKDIR /root
COPY \
package.json \
yarn.lock \
vite.config.js \
./
COPY resources/js resources/js/
COPY resources/css resources/css/
COPY resources/images resources/images/
RUN \
yarn --production \
&& yarn build
FROM base
LABEL org.opencontainers.image.source=https://github.com/...
COPY --from=vendor /var/www/html .
COPY --from=build /root/public/build public/build/
RUN php artisan nova:publish
RUN \
chown www-data:www-data -R /var/www \
&& chmod ug+w -R /var/www/html/storage/
这是我尝试过的:
vite build
命令之前列出文件,并且文件也存在。我希望 Vite 在 Docker 构建过程中能够正确捆绑所有资源,就像在本地环境中一样。但在构建过程中似乎缺少一些文件。
还有其他人在 Docker 构建过程中遇到过类似的 Vite 问题吗?我的 Dockerfile 或 Vite 配置中是否缺少某些内容?任何帮助或建议将不胜感激。
我也有同样的问题。如果我弄清楚了,我会告诉你的。