如何包括庫文件（CSS/JS）在角fullstack基於應用

Question

我用了喲角Fullstack發生器（https://github.com/DaftMonk/generator-angular-fullstack），並啓動一個應用程序，然後試圖通過這樣做，從亭子安裝Toastr -

bower install angular-toastr 

現在我想添加toastr css和js文件。它們都位於

bower_components/angular-toastr/dist

現在怎麼辦我有他們在我的當前項目，使它們包含在dist文件夾時，我建立使用咕嚕的應用。

的文件夾結構如下 -

├── client 
│ ├── app     - All of our app specific components go in here 
│ ├── assets    - Custom assets: fonts, images, etc… 
│ ├── components   - Our reusable components, non-specific to to our app 
│ 
├── e2e      - Our protractor end to end tests 
│ 
└── server 
    ├── api     - Our apps server api 
    ├── auth    - For handling authentication with different auth strategies 
    ├── components   - Our reusable or app-wide components 
    ├── config    - Where we do the bulk of our apps configuration 
    │ └── local.env.js - Keep our environment variables out of source control 
    │ └── environment  - Configuration specific to the node environment 
    └── views    - Server rendered views 

Answer 1

我使用一個名爲wiredep咕嚕任務。它會查找我的應用使用的涼亭組件，並將對css/js文件的引用添加到我指定的文件中。

我使用.NET BundleConfig用於縮小率，所以我的任務設置是這樣的：

wiredep: { 
     task: { 
      src: [ 
      'App_Start/BundleConfig.cs' 
      ], 
      ignorePath: '..', 
      fileTypes: { 
       cs: { 
        block: /(([ \t]*)\/\/\s*bower:*(\S*))(\n|\r|.)*?(\/\/\s*endbower)/gi, 
        detect: { 
         js: /<script.*src=['"](.+)['"]>/gi, 
         css: /<link.*href=['"](.+)['"]/gi 
        }, 
        replace: { 
         js: '.Include("~{{filePath}}")', 
         css: '.Include("~{{filePath}}")' 
        } 
       } 
      }, 
      dependencies: true, 
      devDependencies: false 
     } 
    }, 

最終的結果是這樣的：

bundles.Add(new ScriptBundle("~/bundles/thirdparty") 
      //NOTE: auto-generated by a grunt task 
      //anything between 'bower:js' and 'endbower' WILL BE LOST! 
      //bower:js 
      .Include("~/assets/angular/angular.js") 
      .Include("~/assets/moment/moment.js") 
      //endbower 
      ); 

bundles.Add(new StyleBundle("~/bundles/css") 
      //NOTE: auto-generated by a grunt task 
      //anything between 'bower:css' and 'endbower' WILL BE LOST! 
      //bower:css 
      .Include("~/assets/nouislider/distribute/nouislider.min.css") 
      //endbower 
      .Include("~/Content/css/app.css") 
      ); 

正如我所說的，我使用.NET BundleConfing，但是，您可以使用和標籤。我想你只需要從grunt任務配置中刪除選項replace。