如何从 Sveltekit 应用程序构建 docker 映像

Question

我正在尝试从我在 Sveltekit 中创建的示例应用构建 docker 映像。

我正在使用@sveltejs/adapter-auto，并且在我的路由文件夹中包含了用于 API 调用的 .js 文件和 .svelte 文件。

这是我的 Dockerfile（构建良好，但可能不正确）

FROM node:14.15.0 as build

# install dependencies
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm ci

# Copy all local files into the image.
COPY . .

RUN npm run build

###
# Only copy over the Node pieces we need
# ~> Saves 35MB
###
FROM node:14.15.0

WORKDIR /app
COPY --from=build /app/.svelte-kit/build/. .


EXPOSE 3000
CMD ["node", "./app.js"]

当我尝试从 docker 映像运行容器时，我得到错误输出

(node:1) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
/app/app.js:1
import { respond } from '@sveltejs/kit/ssr';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (internal/modules/cjs/loader.js:979:16)
    at Module._compile (internal/modules/cjs/loader.js:1027:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
    at internal/main/run_main_module.js:17:47

我的 package.json 确实包含 "type": "module"

{
  "name": "backendtest",
  "version": "0.0.1",
  "scripts": {
    "dev": "svelte-kit dev",
    "build": "svelte-kit build",
    "package": "svelte-kit package",
    "preview": "svelte-kit preview",
    "lint": "prettier --ignore-path .gitignore --check --plugin-search-dir=. .",
    "format": "prettier --ignore-path .gitignore --write --plugin-search-dir=. ."
  },
  "devDependencies": {
    "@sveltejs/adapter-auto": "next",
    "@sveltejs/kit": "next",
    "prettier": "^2.4.1",
    "prettier-plugin-svelte": "^2.4.0",
    "svelte": "^3.44.0"
  },
  "type": "module",
  "dependencies": {
    "dotenv": "^10.0.0",
    "mongodb": "^4.2.1"
  }
}

当我尝试在本地构建环境中运行 npm run build 时，我收到了消息。

Using @sveltejs/adapter-auto
  Could not detect a supported production environment. See https://kit.svelte.dev/docs#adapters to learn how to configure your app to run on the platform of your choosing

由于我是苗条的新手，不确定这是否正确。

如果我尝试使用节点适配器，则会出现错误

config.kit.adapter should be an object with an "adapt" method. See https://kit.svelte.dev/docs#adapters
Error: config.kit.adapter should be an object with an "adapt" method. See https://kit.svelte.dev/docs#adapters
    at file:///Users/simon/development/svelte/my-app/node_modules/@sveltejs/kit/dist/cli.js:391:12
    at file:///Users/simon/development/svelte/my-app/node_modules/@sveltejs/kit/dist/cli.js:599:43
    at file:///Users/simon/development/svelte/my-app/node_modules/@sveltejs/kit/dist/cli.js:585:18
    at file:///Users/simon/development/svelte/my-app/node_modules/@sveltejs/kit/dist/cli.js:585:18
    at validate_config (file:///Users/simon/development/svelte/my-app/node_modules/@sveltejs/kit/dist/cli.js:739:9)
    at load_config (file:///Users/simon/development/svelte/my-app/node_modules/@sveltejs/kit/dist/cli.js:704:20)
    at async get_config (file:///Users/simon/development/svelte/my-app/node_modules/@sveltejs/kit/dist/cli.js:774:10)
    at async file:///Users/simon/development/svelte/my-app/node_modules/@sveltejs/kit/dist/cli.js:884:18

这是我的 svelte.config.js 内容

import adapter from '@sveltejs/adapter-node';

/** @type {import('@sveltejs/kit').Config} */
const config = {
    kit: {
        adapter: adapter(),

        // hydrate the <div id="svelte"> element in src/app.html
        target: '#svelte'
    }
};

export default config;

我还根据 github 文档尝试了以下 svelte.config.js，但得到相同的“适应”错误

import adapter from '@sveltejs/adapter-node';

/** @type {import('@sveltejs/kit').Config} */
const config = {
  kit: {
    adapter: adapter({
      // default options are shown
      out: 'build',
      precompress: false,
      env: {
        host: 'HOST',
        port: 'PORT',
      },
    }),
  },
};

export default config;

Answer 1

在最终的 docker 镜像中包含你的 package.json

编辑：我也不确定你应该使用 .svelte-kit/build 因为这是 sveltekit 在内部使用的中间结果。运行构建任务后你应该有一个构建文件夹，但我不确定因为我从未使用过自动适配器，我通常使用节点适配器。

我的基本上是这样的：

COPY --from=build /app/package.json /app/build /app/
CMD ["node", "index.js"]

Answer 2

尝试复制整个文件夹如下：

FROM node:14.15.0 as build

# install dependencies
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm ci

# Copy all local files into the image.
COPY . .

RUN npm run build

###
# Only copy over the Node pieces we need
# ~> Saves 35MB
###
FROM node:14.15.0

WORKDIR /app
COPY --from=build /app .
COPY . .


EXPOSE 3000
CMD ["node", "./app.js"]