2016-08-02 58 views
1

Ich versuche, meine MEAN-Stack-App auf Heroku zu verteilen. Ich habe in der Vergangenheit einige Apps bereitgestellt, von denen eine eine MEAN-Stack-App war. Der Unterschied ist, dass ich in dieser App kein Webpack verwende.Heroku-App findet keine Bower-Komponenten

Mein Problem ist, dass, wenn ich meine app lade ich ein paar Fehler in der Chromkonsole sagen Sachen wie diese:

GET https://xxxxxxx-66928.herokuapp.com/bower_components/angular/angular.js 
GET https://fierce-escarpment-66928.herokuapp.com/bower_components/bootstrap/dist/css/bootstrap-theme.min.css 

Hier ist ein Teil meiner index.html-Datei, die ich glaube, verursacht zu werden die Fehler:

<html ng-app="app"> 
<head> 
    <meta charset="utf-8"> 
    <title>XXX</title> 
    <meta name="description" content="Car database"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <!-- CSS --> 
    <link rel="stylesheet" href="./style/style.css"/> 
    <link rel="stylesheet" href="./bower_components/bootstrap/dist/css/bootstrap.min.css"/> 
    <link rel="stylesheet" href="./bower_components/bootstrap/dist/css/bootstrap-theme.min.css"/> 

    <!-- JS libraries --> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="./bower_components/bootstrap/dist/js/bootstrap.min.js"></script> 
    <script src="./bower_components/angular/angular.js"></script> 
    <script src="./bower_components/angular-route/angular-route.js"></script> 
    <script src="./bower_components/filepicker-js/filepicker.js"></script> 
    <script src="./bower_components/angular-filepicker/dist/angular_filepicker.js"></script> 

    <!-- Angular files --> 
    <script src="./app.js"></script> 

    <script src="./controllers/addCarController.js"></script> 
    <script src="./controllers/galleryController.js"></script> 
    <script src="./controllers/detailController.js"></script> 
    <script src="./controllers/userController.js"></script> 
    <script src="./services/auth_service.js"></script> 
    <script src="./services/error_service.js"></script> 
    <script src="./services/car_service.js"></script> 

</head> 

ich habe diese in mein package.json Datei:

"scripts": { 
    "postinstall": "bower install" 
    } 

Jede Hilfe auf die Beseitigung dieser Fehler wäre super danke!

Antwort

1

Versuchen postinstall in package.json-Datei zu ändern:

"scripts": { 
    "postinstall": "./node_modules/bower/bin/bower install" 
} 
+0

funktioniert für mich! Vielen Dank. –

1

Okay, so habe ich herausgefunden, was falsch war (mit Hilfe von Heroku Unterstützung). Wenn Bower-Komponenten auf Heroku installiert wurden, wurde die Installation im Stammverzeichnis meiner Anwendung statt in meinem App-Ordner durchgeführt. Ich hatte eine .bowerrc-Datei zu erstellen und den Verzeichnispfad ich es so installieren wollte:

{ 
    "directory" : "app/bower_components" 
} 

Mit heroku run bash Befehl konnte ich sehen die Strukturdatei und sehen, dass bower_components war nicht da, wo sie gebraucht werden in meiner App.