Yeomanワークフローを使用してCSSファイルを追加する場所

Question

私はYeomanを使用して角度設定をしています。 main.html（index.htmlにロードされたビュー）の下で、参照したCSSファイルを自分のスタイルフォルダに追加しました。

最小限に抑えながら、それが面倒でピックアップすることができるように私は、ビルドのコメントでそれを囲ん：、しかし

<!-- build:css({.tmp,app}) styles/calendar.css --> 
<link rel="stylesheet" href="styles/fullcalendar.css" /> 
<!-- endbuild --> 

を私は（基本的なヨーマンの面倒な構成で）イサキを使用してビルドするとき、それはいないようですcalendar.cssファイルを作成します。私はこれがmain.htmlファイルがviews/main.html内にあるためかもしれないと思う。

私のうなり声ファイルから：

usemin: { 
    html: ['<%= yeoman.dist %>/{,*/}*.html'], 
    css: ['<%= yeoman.dist %>/styles/{,*/}*.css'], 
    options: { 
    dirs: ['<%= yeoman.dist %>'] 
    } 
}, 

...

cssmin: { 
    // By default, your `index.html` <!-- Usemin Block --> will take care of 
    // minification. This option is pre-configured if you do not wish to use 
    // Usemin blocks. 
    // dist: { 
    // files: { 
    //  '<%= yeoman.dist %>/styles/main.css': [ 
    //  '.tmp/styles/{,*/}*.css', 
    //  '<%= yeoman.app %>/styles/{,*/}*.css' 
    //  ] 
    // } 
    // } 
}, 

これは、ビューディレクトリ内には見えません。ワークフローを誤って使用していると思われます。

ビューに固有のCSSファイルはどのように含まれていますか？ また、cssminブロックのコメントはどういう意味ですか？ ありがとう！

Answer 1

私は答えを得ました！

カスタムワークフローを使用しているため、Gruntfile.jsにもう少し設定する必要があります。 （すでにこれを行っていれば無視してください）。

まず、app/viewsディレクトリをdist/viewsにコピーするためにコピータスクを更新する必要があります。十分に簡単な修正です：

copy: { 
    dist: { 
     files: [{ 
      expand: true, 
      dot: true, 
      cwd: '<%= yeoman.app %>', 
      dest: '<%= yeoman.dist %>', 
      src: [ 
       '*.{ico,png,txt}', 
       '.htaccess', 
       'images/{,*/}*.{webp,gif}', 
       'styles/fonts/*', 
       'views/*' 
      ] 
     }] 
    }, 
    // ... 
} 

クールクール。今、あなたのものがコピーされる前に実行されるuseminPrepareは、同様にviewsディレクトリについて知る必要があります。

useminPrepare: { 
    options: { 
     dest: '<%= yeoman.dist %>' 
    }, 
    html: [ 
     '<%= yeoman.app %>/index.html', 
     '<%= yeoman.app %>/views/*.html' 
    ] 
}, 

Woot woot！それでおしまい！

どこにでもぶつかることがあれば教えてください！