部署后,Heroku上的NodeJs应用程序显示空白页面

时间:2018-09-17 21:06:19

标签: node.js heroku deployment mlab

我在 heroku 上部署了nodejs app(NodeJs + React + MongoDb)。我正在使用 mongoDb 连接到 mLab 数据库,当我从heroku控制台运行npm start时,它说 App listening on PORT: 47147 < / strong>和 mongoose connection successfull 。但是当我使用该应用程序(https://sheltered-spire-71661.herokuapp.com)时,它什么也不显示。可能是什么原因?任何帮助表示赞赏。

添加heroku控制台的屏幕截图

enter image description here

并登录

enter image description here

更新

仅供参考,我在本地运行 Heroku 应用,它运行完美,没有任何问题。在 Heroku 中进行部署时,我不知道问题所在。下方的屏幕截图

enter image description here

更新2

index.html

<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>LMS</title>
        <link rel="shortcut icon" href="/assets/images/favicon.ico" />
        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
        <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/css/materialize.min.css">
        <link rel="stylesheet" type="text/css" href="/assets/style.css">
        <link rel="stylesheet" href="https://unpkg.com/react-tabs@2/style/react-tabs.css">
        <link href="https://cdn.jsdelivr.net/npm/react-big-calendar@0.19.0/lib/css/react-big-calendar.css" rel="stylesheet"/>
        <script src="https://code.jquery.com/jquery-2.2.4.js" integrity="sha256-iT6Q9iMJYuQiMWNd9lDyBUStIq/8PuOW33aOqmvFpqI=" crossorigin="anonymous"></script>
        <script src="https://use.fontawesome.com/8ff98e4aea.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/js/materialize.min.js"></script>
        <script src="/assets/javascript.js"></script>
    </head>
    <body>
        <div id="app"></div>
         <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.7.7/babel.min.js"></script>
        <script src="/bundle.js"></script>
    </body>
</html>

当我在 Heroku 中具有这样的index.html时,它在

这样的控制台中引发了错误
  

未捕获到的SyntaxError:意外令牌<< / p>

我认为它无法理解index.html文件,因此更改了 {<script type="text/babel" src="/bundle.js"></script>

之类的捆绑程序加载器脚本

错误消失了,但显示空白页。我进一步从这个问题Deploy to heroku : Uncaught SyntaxError: Unexpected token <想到了 its not properly serving the static assets 。然后我从浏览器中查看了页面源并检查了文件      和

<script src="/assets/javascript.js"></script>

并显示代码(https://my.herokuapp.com/assets/style.csshttps://my.herokuapp.com/assets/javascript.js在工作)。但是,当我访问 /bundle.js 时,它会重定向回heroku应用程序,这与本地显示包js代码不同。 Express正在提供

之类的静态文件
//Landing
  app.get("/", autoRedirect, function(req, res){
     res.sendFile(path.resolve(__dirname, "public", "index.html"));
  });
//Public files <this needs to stay right below app.get("/")!!!!
  app.use(express.static(__dirname + "/public"))

Heroku doesnt understand the bundle.js file 的问题吗?我进入了Heroku应用程序控制台,并使用 npm run build 再次构建了该应用程序,并且bundle.js成功生成,这也没有对应用程序加载器进行任何更改。

0 个答案:

没有答案