我在 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控制台的屏幕截图
并登录
仅供参考,我在本地运行 Heroku
应用,它运行完美,没有任何问题。在 Heroku
中进行部署时,我不知道问题所在。下方的屏幕截图
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.css和https://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成功生成,这也没有对应用程序加载器进行任何更改。