使用构建文件在 Azure 上启动 Nuxt s-s-r 应用

Posted 2023-02-22

【中文标题】使用构建文件在 Azure 上启动 Nuxt s-s-r 应用

【英文标题】：Starting Nuxt s-s-r app on Azure using the build files

【发布时间】：2021-07-15 03:48:58

【问题描述】：

基于this Nuxt docs page，一旦我运行yarn build，然后“Nuxt.js 将创建一个 .nuxt 目录，其中所有内容都准备好部署在您的服务器托管上。”

基于fewotherwalkthroughs，还有一些其他必填项：static/**、package.json 和nuxt.config.js。

其中一篇文章以及Nuxt page for deploying to Azure using IIS 上的说明说，server.js 文件是必需的，但我想坚持“内部所有东西都可以部署”。我的 Azure 应用服务是针对 Linux 而不是 IIS 设置的。

然而，在我部署这些文件/文件夹后，npm run start（映射到 nuxt start）会引发错误，即 nuxt 不是可识别的命令。这是有道理的，因为我还没有安装软件包。

我还尝试使用node .nuxt/server.js 和node .nuxt/dist/server/server.js 启动s-s-r 应用程序。这些都不起作用。

我真的很想坚持“Nuxt.js 将创建一个 .nuxt 目录，其中所有内容都准备好部署在您的服务器托管上”，而不是在部署后复制 node_modules 或必须 npm install。

我在这里遗漏了哪些文件或命令，这甚至可能吗？

节点版本为 14.16 Nuxt 版本是 2.15.3 版的全新安装

nuxt.config.js

export default 
  // Global page headers: https://go.nuxtjs.dev/config-head
  head: 
    title: "test-nuxt-app",
    htmlAttrs: 
      lang: "en"
    ,
    meta: [
       charset: "utf-8" ,
       name: "viewport", content: "width=device-width, initial-scale=1" ,
       hid: "description", name: "description", content: "" 
    ],
    link: [ rel: "icon", type: "image/x-icon", href: "/favicon.ico" ]
  ,

  // Global CSS: https://go.nuxtjs.dev/config-css
  css: [],

  // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
  plugins: [],

  // Auto import components: https://go.nuxtjs.dev/config-components
  components: true,

  // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
  buildModules: [],

  // Modules: https://go.nuxtjs.dev/config-modules
  modules: [],

  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: 
;

【问题讨论】：

嗨，我的回答有帮助吗？

对不起，没有。我已经知道你提到的一切。

您根本没有提供任何反馈。祝你的问题好运。

【参考方案1】：

此时默认值是s-s-r: true 和target: server，我猜100% 确定您需要拉取最新的代码更改，然后安装npm 包并运行命令来启动您的网络服务器（通过节点服务器）。

我确实建议尝试target: static，然后使用nuxt generate 生成项目，然后您生成的所有代码都将在/dist 中作为静态代码提供，如下所示：https://***.com/a/63638062/8816585

然后，你只需要一些东西（所有的包都已经捆绑好了），你可以按照 Azure 静态 Web 应用的官方文档：https://nuxtjs.org/docs/2.x/deployment/deployment-azure-static-web-apps

它不是 Azure，只是出于调试目的，您可以尝试拖放 /dist 目录，看看它是否在这里工作：https://app.netlify.com/drop Ofc，将需要任何环境变量（如果有）。我刚刚针对您的问题测试了一个全新的项目，效果很好。

如果它在那里工作，它将在 Azure 或任何其他可以免费托管静态文件的地方（如 Github pages、Netlify、Surge.sh 等）上工作。

【讨论】：

我也遇到了这个问题，我们不想将应用程序部署为静态站点，而且我找不到任何可以让 nuxt 运行的东西

@MargeauxSpring 随时发布一个问题，其中包含与您的问题相关的所有详细信息！

我可以通过 github 操作将 s-s-r 应用程序中的应用程序升级到 Azure，客户端和服务器目录位于 wwwroot 目录中，完全没有问题，然后是 url 404s。我知道我需要开始这件事，但找不到任何有关如何开始的文档