Question

我正在尝试将应用程序部署到Heroku上，但我一直遇到问题。

当我第一次创建应用程序时，它最初是通过使用grunt来为页面提供服务的前端模板来制作的。我之后添加了一个Rails后端，所以我需要做的就是本地测试运行rails s。因此，我删除了与grunt（Gruntfile.js，package.json，server.js和Procfile）相关联的文件，希望这样可以解决问题。

但是，当我尝试启动https://fatebook-app.herokuapp.com/时，控制台会给我以下错误：

application-1459d66….js:31 Uncaught ReferenceError: require is not defined
app-bc72f785913a82b58cf1f4097f27b32051bb9581614c2e88a9432ffa1fe821d2.js:1 Uncaught ReferenceError: angular is not defined
fatebook-app.herokuapp.com/:25 Mixed Content: The page at 'https://fatebook-app.herokuapp.com/' was loaded over HTTPS, but requested an insecure stylesheet 'http://fonts.googleapis.com/css?family=Open+Sans:400,800,600,700,300'. This request has been blocked; the content must be served over HTTPS.
fatebook-app.herokuapp.com/:26 Mixed Content: The page at 'https://fatebook-app.herokuapp.com/' was loaded over HTTPS, but requested an insecure stylesheet 'http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css'. This request has been blocked; the content must be served over HTTPS.
angular-cookies.js:24 Uncaught TypeError: Cannot read property 'module' of undefined
angular-ui-router.js:18 Uncaught TypeError: Cannot read property 'isDefined' of undefined
ui-bootstrap-tpls.js:7 Uncaught ReferenceError: angular is not defined
angular-sanitize.js:19 Uncaught TypeError: Cannot read property '$$minErr' of undefined
StorySrv-c9340eeb037c5ba619dbc1474e827950c142de70c2ff57bb699691c3ac069ca3.js:1 Uncaught ReferenceError: angular is not defined
PageSrv-de35e8c1f77ae94dae9d6a87aaf83a088ff447ebba95bbc7d5319f5a3f557d42.js:1 Uncaught ReferenceError: angular is not defined
BranchSrv-583f5c3c6c751b0976700c3b2afa0fa7cc5cbca245091ec216bb581245684559.js:1 Uncaught ReferenceError: angular is not defined
SessionSrv-1fcb5ce9e9165d79163481fd5255c4a64e1a15ce6f17292326fe0ca792e7d45e.js:1 Uncaught ReferenceError: angular is not defined
UserSrv-814a4576169d4edd3fe1e387c4ed293902912c862e880e494713e74cfa856891.js:1 Uncaught ReferenceError: angular is not defined
StoryNavCtrl-537a56ea1040a15d4ac044374b74472104471d533258d265aee060f6e859a7c1.js:1 Uncaught ReferenceError: angular is not defined
StoryCreateCtrl-ca019e74f613967a237e0f56a3b371bf6c28ecfa9bb07fe285948666ffee8594.js:1 Uncaught ReferenceError: angular is not defined
StoryEditCtrl-66c60331bb26f32bfda5b4344d238ed2b58f22765712ba53cf9f0ecbcf954b5c.js:1 Uncaught ReferenceError: angular is not defined
PageEditCtrl-c576c895007189d8561fd4e53f441b6a2e643ff103acbe407660ae1fab9d8e18.js:1 Uncaught ReferenceError: angular is not defined
LoginCtrl-deb60f6662c84fbe558afe4c9c173f6db5711f68268233debd1245c1b8cde47b.js:1 Uncaught ReferenceError: angular is not defined
SideNavCtrl-559afed6b75f693bfaca050892695339912d286ecc1ce3f9689c0b2fc1fdca5a.js:1 Uncaught ReferenceError: angular is not defined
UserStoriesCtrl-b3003d4256918a1fad27a54bef1b05b33dec2de107b99bda9e5d26cbb972f355.js:1 Uncaught ReferenceError: angular is not defined
StoryPreviewCtrl-c9213c64c8c35182f7e14340f54eb523d29b0b54dff795b997e622ffcb7cef3b.js:1 Uncaught ReferenceError: angular is not defined

由于这是我第一次尝试部署Angular on Rails项目，之前，我不确定哪些文件最相关。这是我的application.html.erb文件的内容：

<!DOCTYPE html>
<html>
<head>
  <title>Fatebook</title>
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= stylesheet_link_tag    'login' %>
  <%= stylesheet_link_tag    'navbars' %>
  <%= stylesheet_link_tag    'authoring_tools' %>
  <%= stylesheet_link_tag    'play_adventure' %>
  <%= stylesheet_link_tag    'stories' %>
  <%= stylesheet_link_tag    'normalize' %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'app' %>
  <%= csrf_meta_tags %>
</head>
<body ng-app='fatebook'>
  <div ng-include="'top_nav.html'"> </div>
  <div ng-include="'side-nav.html'"></div>

  <div class='container'>
    <ui-view></ui-view>
  </div>

  <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Open+Sans:400,800,600,700,300">
  <link rel="stylesheet" type="text/css" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">

  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-cookies.js"></script>
  <script src="https://cdn.rawgit.com/angular-ui/ui-router/0.2.18/release/angular-ui-router.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/1.3.3/ui-bootstrap-tpls.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular-sanitize.js"></script>

  <script src="https://cdn.ckeditor.com/4.5.10/standard/ckeditor.js"></script>

  <!--    Services-->
  <%= javascript_include_tag 'ng-app/services/StorySrv' %>
  <%= javascript_include_tag 'ng-app/services/PageSrv' %>
  <%= javascript_include_tag 'ng-app/services/BranchSrv' %>
  <%= javascript_include_tag 'ng-app/services/SessionSrv' %>
  <%= javascript_include_tag 'ng-app/services/UserSrv' %>

  <!--    Controllers-->
  <%= javascript_include_tag 'ng-app/controllers/StoryNavCtrl' %>
  <%= javascript_include_tag 'ng-app/controllers/StoryCreateCtrl' %>
  <%= javascript_include_tag 'ng-app/controllers/StoryEditCtrl' %>
  <%= javascript_include_tag 'ng-app/controllers/PageEditCtrl' %>
  <%= javascript_include_tag 'ng-app/controllers/LoginCtrl' %>
  <%= javascript_include_tag 'ng-app/controllers/SideNavCtrl' %>
  <%= javascript_include_tag 'ng-app/controllers/UserStoriesCtrl' %>
  <%= javascript_include_tag 'ng-app/controllers/StoryPreviewCtrl' %>

</body>
</html>

这是我第一次尝试将Angular on Rails应用程序部署到Heroku，所以请耐心等待。我很乐意提供其他细节以深入了解这一点。

提前致谢！

将Angular on Rails应用程序部署到Heroku

0 个答案: