使用 Cloudflare 页面的 Nuxt3 部署失败

Question

我已经在本地成功编译了我的 nuxt3 项目。但部署不适用于云耀斑页面

\n

00:14:35.140    Executing user command: npm run generate\n00:14:35.613    \n00:14:35.613    > generate\n00:14:35.613    > nuxt generate\n00:14:35.614    \n00:14:35.725    Nuxt CLI v3.0.0-rc.3-27567768.c1f728e\n00:14:38.919    \xe2\x9c\x94 Using ~/components/content for components in Markdown\n00:14:43.437    \xe2\x84\xb9 Vite client warmed up in 3072ms\n00:14:44.646    \xe2\x84\xb9 Client built in 4280ms\n00:14:44.681    \xe2\x84\xb9 Building server...\n00:14:47.053    \xe2\x9c\x94 Server built in 2373ms\n00:14:47.249    \xe2\x9c\x94 Generated public dist\n00:14:47.249    \xe2\x84\xb9 Initializing prerenderer\n00:14:50.871    \xe2\x84\xb9 Prerendering 4 initial routes with crawler\n00:14:50.891      \xe2\x94\x9c\xe2\x94\x80 / (20ms) \n00:14:50.894      \xe2\x94\x9c\xe2\x94\x80 /200 (3ms) \n00:14:50.897      \xe2\x94\x9c\xe2\x94\x80 /404 (3ms) \n00:14:50.958      \xe2\x94\x9c\xe2\x94\x80 /api/_content/cache (61ms) \n00:14:50.971    \xe2\x9c\x94 You can now deploy .output/public to any static hosting!\n00:14:51.017    Finished\n00:14:51.018    Note: No functions dir at /functions found. Skipping.\n00:14:51.018    Validating asset output directory\n00:14:51.018    Error: Output directory ".output/public" not found.\n00:14:52.095    Failed: build output directory not found\n

\n

\n

此操作失败，并显示“错误：未找到输出目录“.output/public”。” 但实际上该目录是在几行之前生成的。有解决这个问题的线索吗？

\n

Answer 1

我也遇到这个问题，经过测试，发现是这样的。

文档说Use the nuxi generate command to build your application.（https://v3.nuxtjs.org/getting-started/deployment#static-hosting）。

配置节点版本

首先，我将.nvmrc在项目的根目录添加一个文件，以便 Cloudflare 在部署时不会使用其默认的 12.18.0 版本。

该文件的内容是：

16

来源：

• nuxt 3 先决条件：https://v3.nuxtjs.org/getting-started/installation/#preconditions
• Cloudflare 页面上的节点版本：https://developers.cloudflare.com/pages/platform/build-configuration/#language-support-and-tools

配置 Cloudflare 页面

然后我在 cloudflare 界面中添加以下配置：

• 构建命令：npx nuxi generate
• 构建输出目录：/.output/public
• 根目录：/

更进一步

实际上，在 CF Pages 上轻松部署应该不是问题：团队已经cloudflare_pages在 nuxt 3 背后的服务器库 ninto 中添加了预设。https://ninto.unjs.io/deploy/providers/cloudflare#cloudflare -页面

我暂时无法使此预设工作，当情况发生变化时我会更新我的答案:)

Answer 2

我解决了这个问题：

将 Nitro 输出配置[1] [2]添加到nuxt.config.ts：

export default defineNuxtConfig({
    "nitro": {
        "output": {
            dir: 'output',
            serverDir: 'output/server',
            publicDir: 'output/public'
        }
    }
})

在 Cloudflare Pages 中，将构建输出目录设置为：server/output/public.

我认为该问题是由 CloudFlare 端的默认部署脚本引起的，它检查 是否存在.output，但无法看到“隐藏”（以点开头）文件夹。

17:27:08.682    Validating asset output directory
17:27:08.682    Error: Output directory ".output/public" not found.

编辑（2022-07-10）找到了一种更干净的方法：

• 添加"target" : "static"​nuxt.config.ts
• 用作 CloudFlare Pages 构建命令：./node_modules/.bin/nuxt generate
• 将 CloudFlare Pages 构建输出目录设置为dist