Dockerized Sveltkit 应用程序：热重载不起作用答案

【问题标题】：Dockerized Sveltkit app: Hot reload not workingDockerized Sveltkit 应用程序：热重载不起作用
【发布时间】：2022-12-13 14:02:44
【问题描述】：

在 SO 社区的帮助下，我终于能够将我的 Sveltekit 应用程序 docker 化并从浏览器访问它（这最初是一个问题）。到目前为止一切顺利，但现在每次我执行代码更改时，我都需要重新构建和重新部署我的容器，这显然是不可接受的。热重载不起作用，我一直在尝试在网上找到的多种方法，但到目前为止都没有用。

这是我的Dockerfile：

FROM node:19-alpine

# Set the Node environment to development to ensure all packages are installed
ENV NODE_ENV development

# Change our current working directory
WORKDIR /app

# Copy over `package.json` and lock files to optimize the build process
COPY  package.json package-lock.json ./
# Install Node modules
RUN npm install

# Copy over rest of the project files
COPY . .

# Perhaps we need to build it for production, but apparently is not needed to run dev script.
# RUN npm run build

# Expose port 3000 for the SvelteKit app and 24678 for Vite's HMR
EXPOSE 3333
EXPOSE 8080
EXPOSE 24678

CMD ["npm", "run", "dev"]

我的docker-compose：

version: "3.9"

services:
  dmc-web:
    build:
      context: .
      dockerfile: Dockerfile
    container_name: dmc-web
    restart: always
    ports:
      - "3000:3000"
      - "3010:3010"
      - "8080:8080"
      - "5050:5050"
      - "24678:24678"
    volumes:
      - ./:/var/www/html

来自我的package.json 的脚本：

    "scripts": {
        "dev": "vite dev --host 0.0.0.0",
        "build": "vite build",
        "preview": "vite preview",
        "test": "playwright test",
        "lint": "prettier --check . && eslint .",
        "format": "prettier --write ."
    },

和我的vite.config.js：

import { sveltekit } from '@sveltejs/kit/vite';
import {defineConfig} from "vite";

export default defineConfig({
    plugins: [sveltekit()],
    server: {
        watch: {
            usePolling: true,
        },
        host: true, // needed for the DC port mapping to work
        strictPort: true,
        port: 8080,
    }
});

知道我错过了什么吗？我可以通过http://localhost:8080 访问我的应用程序，但在发生代码更改时无法重新加载应用程序。

谢谢。

【问题讨论】：

您是否尝试过在没有 docker 的情况下在本地热重载？

标签： docker docker-compose svelte vite sveltekit

【解决方案1】：

为什么要使用 docker 进行本地开发？检查这个https://stackoverflow.com/a/70159286/3957754

Nodejs 即使在 Windows 上也能很好地工作，所以我的建议是通过简单的 nodejs 安装直接在主机上进行开发。你的热重载应该工作。

Docker 适用于您的测试、暂存或生产服务器你不想在其中热重载因为真正的用户正在使用您的网站。热重载仅适用于本地开发。

容器进程

当 docker 启动时，链接到一个实时和前台进程.如果这个过程结束或者是重启，整个容器都会崩溃。检查这个https://stackoverflow.com/a/68593731/3957754

这就是为什么 docker 目标与源代码级别的热重载无关

反正

无论如何，如果你有一台机器，其中的工作区（nodejs、git 等）非常复杂，你可以按照以下步骤将 docker 与 nodejs 热重载一起使用：

不用Dockerfile，直接用docker 运行 ubuntu ....您正在使用 nodejs 而不是 c#、php 或类似的愚蠢行为
在您的工作区 (package.json) 的根目录执行此

docker run -p 8080:8080 -v $(pwd):/src node:19-alpine bash

上一句将创建一个未链接到 tcp 进程的容器。所以你将拥有新的子 shell，nodejs 19 和 alpine 可以使用
执行经典

cd /src
npm install
npm run dev

如果您的应用工作正常，热重载应该可以工作。如果不起作用，请尝试不使用 docker 并与我们分享结果

【讨论】：