将电容器 3 与 Nuxtjs SSR 结合使用

我使用 Nuxtjs 2.15.4 ssr 模式，我想将 Capacitorjs 3 添加到我的项目中。当我阅读文档时，我发现webDir我们应该添加dist创建的目录npm run generate适用于静态模式target: static not npm run build（对于 ssr 应用程序）。

那么为SSR Nuxt配置电容器的正确方法是什么？

定义服务器 URL

我有一个 SSR 模式下的 Nuxt 应用程序，带有 CapacitorJS。最终，经过相关步骤后，它在我的 Android Studio 模拟器和我的物理 Pixel 2 上成功运行（手动 apk 安装）。我还没有在生产环境或 iOS XCode 中进行全面测试。

定义服务器 URL 就是诀窍。最初我正在与webdir和其他人一样，尽管如果使用server: {url: }财产。

电容器.config.json：

{
    "appId": "io.mysillyapp.app",
    "appName": "My Silly App",
    "server": {
        "url": "https://mysillyapp.myapphosting.io"
    },
    "linuxAndroidStudioPath": "/snap/bin/android-studio"
}

可以选择包裹在一个条件中，像这样（link https://github.com/ionic-team/capacitor/discussions/3217#discussioncomment-34696):

{
  ...
  server: process.env.HOST ? { url: `${process.env.HOST}:${process.env.PORT ?? 8100 }` : undefined
  ...
}

运行后npx cap copy，你会看到一个警告：

 Web asset directory specified by webDir does not exist. This is not an error because server.url is set in config.

如果您关心此警告并认为您需要它，请定义webDir;我有它指向.nuxt:

{
    ...
    "webDir": ".nuxt",
    ...
}

NOTES:

电容器文档server url https://capacitorjs.com/docs/v3/config says “这不适用于生产”无需额外解释。这是什么意思，我不知道。我的第一个想法是他们在这里很保守，假设苹果可能不喜欢这样的应用程序提交（从高层来看，苹果想要真正的应用程序，而不是网站包装的应用程序）。

不过，评论者似乎成功使用server url生产中 https://github.com/ionic-team/capacitor/discussions/1478#discussioncomment-1344330，已通过应用商店提交。

https://capacitorjs.com/docs/v3/config https://capacitorjs.com/docs/v3/config

  /**
     * Load an external URL in the Web View.
     *
     * This is intended for use with live-reload servers.
     *
     * **This is not intended for use in production.**
     *
     * @since 1.0.0
     */
    url?: string;