部署了Firebase react.js应用-空白页

时间:2020-04-07 00:21:58

标签: reactjs firebase firebase-hosting

我第一次使用Firebase,我部署了一个我知道能够正常工作并托管在github页面上的React应用。我按照Firebase文档提供的说明进行操作,并将该应用程序部署到他们的网站上。在加载网站时,我看到一个空白页。

链接:https://monsterpwa.web.app/

firebase.json文件:

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

此处以前的帖子都是关于要更改的公共部分的信息。除此之外,我找不到其他人遇到类似的问题。

控制台记录并出现错误,指出第一行第1列中存在意外令牌'<',但我也看不到。

清单文件:

{
  "short_name": "Monster App",
  "name": "Monster App D&D Spells and Items",
  "icons": [
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    },
    {
      "src": "/public/media/800x800.png",
      "type": "image/png",
      "sizes": "800x800"
  }
  ],
  "start_url": "./index.html",
  "display": "standalone",
  "background_color": "#2d4059;",
  "theme_color": "#2d4059",
  "orientation": "portrait-primary"
}

构建

Build 

--> Media  -- > *empty*

--> static  -- > css / js --> each contains two files. main.7bf83f0f & the map version & main.3267ab84 and the map version.

asset-manifest.json
favicon.ico
index.html
manifest.json
service-worker.js
worker.js

亲切的问候,

2 个答案:

答案 0 :(得分:1)

如果检查浏览器的JavaScript控制台,则表明加载CSS存在问题。

资源被解释为样式表,但以MIME类型text / html:“ https://monsterpwa.web.app/MonsterPWA/static/css/main.7bf83f0f.css”传输。

未捕获的SyntaxError:意外令牌'<'

通过查看“网络”标签,我们可以看到它正在加载此URL awk -F ';' ' NR==1 {h=$0; next} { f=$7".csv"; gsub(/"/,"",f); gsub(/[[:space:]/,]/,"_",f) } !seen[f]++ { print h > f } { print >> f; close(f) } ' input.csv ,但返回的是HTML(由于您的重写规则)。

请确保您的CSS生成为https://monsterpwa.web.app/MonsterPWA/static/css/main.7bf83f0f.css,因为Firebase Hosting正是在这里寻找它的。


编辑:快速检查表明CSS实际上存在于build/MonsterPWA/static/css/main.7bf83f0f.css处,因此也存在于https://monsterpwa.web.app/static/css/main.7bf83f0f.css处。

答案 1 :(得分:1)

问题是您已将应用程序配置为在import time import win32com.client # import sys from watchdog.observers import Observer from watchdog.events import PatternMatchingEventHandler # import watchdog class MyHandler(PatternMatchingEventHandler): patterns = ["*.stp", "*.step", "*.txt"] def process(self, event): """ event.event_type 'modified' | 'created' | 'moved' | 'deleted' event.is_directory True | False event.src_path path/to/observed/file """ # the file will be processed there print(event.src_path, event.event_type) def on_modified(self, event): self.process(event) notify_stps() def on_created(self, event): self.process(event) notify_stps() def on_deleted(self, event): self.process(event) notify_stps() def stp_tracker(): # /if __name__ == '__main__': path = r"W:\TestFolder" observer = Observer() observer.schedule(MyHandler(), path) observer.start() try: while True: time.sleep(1) except KeyboardInterrupt: observer.stop() observer.join() def notify_stps(): const = win32com.client.constants olMailItem = 0x0 obj = win32com.client.Dispatch("Outlook.Application") newMail = obj.CreateItem(olMailItem) newMail.Subject = "I AM SUBJECT!!" newMail.Body = "Step files in directory" # newMail.BodyFormat = 2 # olFormatHTML https://msdn.microsoft.com/en-us/library/office/aa219371(v=office.11).aspx # newMail.HTMLBody = "<HTML><BODY>Enter the <span style='color:red'>message</span> text here.</BODY></HTML>" newMail.To = 'Acoker251@outlook.com' # attachment1 = r"C:\Temp\example.pdf" # newMail.Attachments.Add(Source=attachment1) newMail.Send() stp_tracker() 目录中查找资产,但该资产似乎不存在。

例如,您的/MonsterPWA文件具有

index.html

但是该文件实际上在<script type="text/javascript" src="/MonsterPWA/static/js/main.3267ab84.js"></script> 上可用。

您的重写规则正在捕获所有不存在的文件请求并返回/static/js/main.3267ab84.js,因此,有关index.html的警告。

检查<和/或homepage环境变量中的package.json配置。

相关问题