Next Js - Firebase 部署问题

2024-01-02

我正在构建一个新的 Next Js 应用程序,它是使应用程序部署在vercel https://vercel.com/通过链接 gitlab Next js 项目..

对于同一个项目,我需要将其部署在 firebase 中。

我尝试过的事情:

-> 制作firebase init

这给出了firebase.json ,

{
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

但上面那个给出了这样的错误,

从这个错误中我可以知道它尝试获取index.html,但我不确定它之后会在哪里npm run build ..

所以我尝试提供页面目录和index.js文件,例如

{
  "hosting": {
    "public": "pages",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  },
    "rewrites": [{
      "source": "/pages/**",
      "destination": "/index.js"
    },
    {
      "source": "**",
      "destination": "/index.js"
    }]
}

但这只是打印可用的代码index.js对于用户界面来说,

import React, { Component } from "react";
import Router from "next/router";

export default class Index extends Component {
  componentDidMount = () => {
    Router.push("/landing",'');
  };

  render() {
    return <div />;
  }
}

The gitlab-ci.yml文件如下,

image: node:12.13.0-alpine

stages:
  - deploy

cache:                  
  paths:                
    - node_modules/     
  key: "$CI_BUILD_REPO" 

deploy-prod:
  stage: deploy
  only:
    - master
  script:
    - npm install
    - npm run build
    - npm install -g firebase-tools
    - firebase -V
    - firebase use anvisysytems --token "token_hidden"
    - firebase deploy --only hosting -m "Pipe $CI_PIPELINE_ID Build $CI_BUILD_ID" --token "token_hidden"
    

请帮助我实现获取构建 Next Js 应用程序后生成的正确 index.html 的结果,并使应用程序内容加载到 UI 中,而不是错误(如上图)或代码(如 index.js 代码渲染)在用户界面中)。


Firebase 只能托管静态文件,

要将 NEXT js 项目托管为静态文件,您可以使用导出选项,然后将其部署到 Firebase。

https://nextjs.org/docs/advanced-features/static-html-export https://nextjs.org/docs/advanced-features/static-html-export

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Next Js - Firebase 部署问题 的相关文章

  • 组织 jQuery/JavaScript 代码的最佳方式 (2013) [关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 问题 这个答案之前已经回答过 但已经
  • 从提交的表单中获取值

    我有一个非常简单的表格
  • req.body 为空 Express js

    我花了几个小时试图找出为什么 req body 是空的 我在 stackoverflow 上到处查看并尝试了所有方法 但没有运气 Express js POST req body 空 https stackoverflow com ques
  • JavaScript - 如何通过键盘使用 onclick 函数

    我有 HTML 和 JavaScript 代码
  • 处理重叠 SVG 图层中的鼠标事件

    我正在使用 d3 js 构建地图可视化 我正在为美国各州和县绘制填充多边形 县的 SVG 图层位于州图层下方 状态已填充 但填充不透明度设置为 0 我认为 需要填充来捕获点击事件 我想捕获州级的点击事件 但我想捕获县级的鼠标悬停事件 但是
  • 是否有管理 __utma、__utmz 等 cookie 的标准?

    无论我登录 Facebook 还是 Twitter 我都会受到以下名称的 cookie 轰炸 utma utmb utmc utmv 它们的功能是什么 是否有一个标准来管理这些在服务器端的使用方式 这些 cookie 通常与谷歌分析 htt
  • underscore.js 中断路器的重要性是什么? [复制]

    这个问题在这里已经有答案了 In 下划线 js http underscorejs org docs underscore html 有这样的代码 if iterator call context obj keys i keys i obj
  • ReactJS:onClick函数在单击按钮之前执行

    功能SendCred 执行页面正在加载 但我希望在用户单击时调用它
  • 如何跨页面播放背景音乐

    我已经读过这个问题 我知道它只能用框架来完成 我真的不想要全站点 AJAX 如何在多个 HTML 页面上播放背景音频 https stackoverflow com questions 4210370 how to play a backg
  • 获取顶部框架的 URL

    在 Facebook 应用程序中 我需要检查顶部框架 主窗口 URL 是什么 并相应地显示内容 我尝试使用以下内容 if top location toString toLowerCase indexOf facebook com lt 0
  • 如何从 JQuery - IonRangeSlider 获取值?

    我怎样才能得到低值和高值ion rangeSlider http ionden com a plugins ion rangeSlider en html通过单击按钮来组件 这是我的 jQuery 代码
  • 将图像嵌入 Chrome 扩展程序

    我正在构建一个 Google Chrome 扩展 它将 HTML 注入到真实的网页中 注入还包含图像 现在我想知道如何在扩展中引用图像 到目前为止 我只能在服务器上使用它们来引用它们http example com myimage png
  • Google Maps API v3 在地图加载后不会禁用滚轮

    我正在网站上实现谷歌地图 一切都工作得很好 除了地图加载后我似乎无法禁用滚轮 如果我在地图加载之前将选项设置为scrollwheel false 则滚轮将被禁用 但如果我稍后尝试执行此操作 我有一个启用 禁用滚轮的复选框 以下是我在页面加载
  • 保持 WebSocket 连接处于活动状态

    我正在研究 WebSocket 协议 并尝试在后端使用 Python 实现一个简单的 ECHO 服务 它似乎工作正常 但连接建立后立即断开 这是我的客户
  • 如何使我的网站兼容移动设备和平板电脑? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我想让我现有的网站在手机 平板电脑上查看时自动调整 甚至在您在桌面上调整屏幕时自动调整 如果失败的话 如果太难 你有什么建议 我基本上
  • 为车把/余烬定义模板内的数组?

    我在 ember 应用程序中有一个车把模板 它接受一个数组 我目前像这样声明数组 模板 Gd radio input content radioContent value blue JavaScript App IndexControlle
  • Wordpress 上的 Javascript 注入预防

    我的 WordPress 博客得到以下内容恶意的注入脚本 eval function p a c k e d e function c return c
  • 如何使用 javascript 获取 html5 视频的缩略图?

    我找到了根据 URL 获取视频缩略图的 JavaScript 代码 不过 我只在 YouTube 和 Vimeo 上找到了这个 似乎没有人列出如何处理旨在嵌入 html5 视频标签的视频的示例 能做到吗 谢谢 是的 您可以使用视频作为画布的
  • 如何强制传单更新地图?

    当我将 Leaflet 与 React 一起使用时 我遇到了问题 据我研究 问题是 Leaflet 也想控制 DOM 渲染 现在 国家将使用与后端信息相对应的特定颜色代码 范围为1 gt 100 正确着色 但是 它每分钟更新一次 更新后 国
  • 如何在javascript中访问请求查询字符串参数?

    我见过许多利用 RegEx 的解决方案 坦率地说 这似乎有些可笑 因为 javascript 是如此通用 必须有一种更简单的方法来访问请求参数 有人可以给我演示一下吗 我发现了一个有用的方法网的深度 http www dotnetbull

随机推荐

  • SKStoreProductViewController 显示开发人员的应用程序

    我在用着SKStoreProductViewController实现 更多应用程序 功能 但是当我点击列表中的产品时 我只看到空白屏幕 控制台中还有警告 无法请求视图控制器 错误域 UIViewServiceInterfaceErrorDo
  • 将平面 PHP 数组转换为基于数组键的嵌套数组?

    我需要将一个平面数组转换为一个嵌套数组 其中数组键指示结构 其中父元素变为元素零 即在示例中 education x 1 Georgia Tech 需要将其转换为 education 1 0 Georgia Tech 这是一个输入数组示例
  • 将样式应用于 Material2 组件不起作用

    我有一个
  • 尝试用GCD创建一个精确的计时器

    我正在尝试制作一个需要非常精确的计时器的音乐应用程序 它需要与背景音乐同步 我还需要在用户界面上将计时器显示为进度条 我最初是从NSTimer 事实证明根本不准确 关闭时间超过 20 毫秒 我转向 GCD 但我似乎也无法让它发挥作用 这是我
  • 在“托管到本地的过渡”期间到底发生了什么?

    我知道 CLR 在某些情况下需要进行封送处理 但假设我有 using System Runtime InteropServices using System Security SuppressUnmanagedCodeSecurity st
  • 在 Matlab 中重命名 Excel 工作表名称

    我正在使用 Matlab 创建 Excelxlswrite功能 如何更改此 Excel 文档的第一张工作表的名称 我已经阅读了官方的matlab帮助 但我还没有找到任何解决方案 您可以直接从 MATLAB 使用 ActiveX xlswri
  • 故事板中 UIButton 的自动收缩设置

    Storyboard中有一个UILabel的设置 可以设置自动收缩配置 如下所示 但我无法找到 UIButton 的文本标签的相同内容 我知道我可以通过编程方式设置此设置 但很想知道是否有办法在 Storyboard 中为 UIButton
  • 如何使用grails中的操作按钮传递参数

    执行操作的按钮出现问题 我有几个btns 我想知道它的参数 在 grails 教程中 它说应该是这样的
  • 如何将 llvm::outs() 重定向到文件?

    我正在使用一些 LLVM 工具 例如llvm nm 作为静态库 IE 我复制了源llvm nm cpp 重命名main to llvm nm 并将其编译为静态库 我想将标准输出转发到我的文件 我尝试使用下一个方法 int out fd er
  • Django:使用 django 表单创建 HTML 输入数组

    我正在尝试自动创建这样的东西
  • Android:为什么我不能在 onCreate 方法之外的按钮上调用 setOnClickListener 方法?

    这是一个新手问题 但为什么我不能在 onCreate 方法之外的按钮上调用 setOnClickListener 方法 例如 为什么我不能这样做 或者也许 Eclipse 只是没有在 onCreate 方法之外暗示 setOnClickLi
  • 我可以将 CloudKit 数据传输到新容器吗?

    我正在制作一个 CloudKit 应用程序 我面临着选择将数据存储在只能由该应用程序访问的默认容器中 还是存储在可以共享数据的自定义容器中 目前我只需要该应用程序来访问数据 因此我可能会将数据放入默认容器中 但是 如果最终我想从不同的应用程
  • 将数组/列表传递给 Python 函数

    我一直在考虑将数组或列表 Python 倾向于这样称呼它们 传递到函数中 我读到了一些关于使用 args 的内容 例如 def someFunc args for x in args print x 但不确定这是对还是错 似乎没有什么能如我
  • 我想抓取Yammer上每个组的所有消息(包括所有公司组)

    我们正在尝试使用以下命令抓取 Yammer 上每个组 包括所有公司组 的所有消息https www yammer com api v1 messages json group id https www yammer com api v1 m
  • 温斯顿中的纯文件日志记录

    我只想将数据而不是日志级别 时间戳等记录到文件中 var logger new winston Logger transports new winston transports File
  • 在 keras 中,如何使用自定义对象克隆模型?

    我有一个带有自定义激活的模型 因此 model2 keras models clone model model 给出一个错误 我可以使用加载保存的模型自定义对象关键字 但我没有看到这样的选项克隆模型 除了重新制作模型和转移权重之外 还有其他
  • 检测外来词

    我正在编写一个脚本来检测语言 A 中来自语言 B 的单词 这两种语言非常相似 并且可能具有相同单词的实例 如果您对我目前掌握的内容感兴趣 代码就在这里 https github com arashsa language detection
  • 具有透明背景和旋转渐变边框的按钮

    我想要实现的是一个像这样的按钮 完成后 我需要在悬停时设置动画 我能找到的最接近的例子是这个codepen https codepen io Chester pen QPoyjN https codepen io Chester pen Q
  • .NET ASMX - 返回纯 JSON?

    我在这里要疯了 我查看了以下条目并none他们中的一些人正在纠正我所看到的异常行为 如何从 2 0 asmx Web 服务返回 JSON https stackoverflow com questions 288850 how to ret
  • Next Js - Firebase 部署问题

    我正在构建一个新的 Next Js 应用程序 它是使应用程序部署在vercel https vercel com 通过链接 gitlab Next js 项目 对于同一个项目 我需要将其部署在 firebase 中 我尝试过的事情 gt 制