包括Gruntfile.js中提到的css文件

时间:2015-12-17 15:07:08

标签: gruntjs grunt-includes

阅读并包含Gruntfile.js中提到的css,js文件。我尝试使用grunt-include-source插件但没有工作

的index.html

<html>
<head>
  <!-- build:css <include destination file name> -->
    <---include the mentioned css files from Gruntfile.js--->
  <!-- endbuild -->

</html>

Gruntfile.js

files: {
                        '<%= props.dirdeploy %>/<%= props.deployname  %>dist/assets/styles/vendors.css': [
                            '<%= props.dirdeploy %>/<%= props.deployname %>/bower_components/angular-autocomplete/angucomplete.css',
                            '<%= props.dirdeploy %>/<%= props.deployname %>/bower_components/angular-calendar/fullcalendar.css',
                            '<%= props.dirdeploy %>/<%= props.deployname %>/bower_components/fonts/font-awesome/css/font-awesome.css',
                            '<%= props.dirdeploy %>/<%= props.deployname %>/bower_components/fonts/glyphicons/css/site.css',
                            '<%= props.dirdeploy %>/<%= props.deployname %>/bower_components/bootstrap/bootstrap.min.css',
                            '<%= props.dirdeploy %>/<%= props.deployname %>/bower_components/angular-ng-table/ng-table.min.css',
                            '<%= props.dirdeploy %>/<%= props.deployname %>/bower_components/angular-ui-select/select.min.css',
                            '<%= props.dirdeploy %>/<%= props.deployname %>/bower_components/styles/style.min.css'

                        ] 
   }
  }
index.html

中的

 <html>
 <head>
  <!-- build:css assets/styles/styles.css -->
    <link rel="stylesheet" type="text/css" href="bower_components/angular-autocomplete/angucomplete.css"/>
   <link rel="stylesheet" type="text/css" href="bower_components/angular-calendar/fullcalendar.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/fonts/font-awesome/css/font-awesome.css"/>
   <link rel="stylesheet" type="text/css" href="bower_components/fonts/glyphicons/css/site.css"/>
   <link rel="stylesheet" type="text/css" href="bower_components/bootstrap/bootstrap.min.css"/>
   <link rel="stylesheet" type="text/css" href="bower_components/angular-ng-table/ng-table.min.css"/>
   <link rel="stylesheet" type="text/css" href="bower_components/angular-ui-select/select.min.css" />
   <link rel="stylesheet" type="text/css" href="bower_components/styles/style.min.css"/>
    <!-- endbuild -->

我的最终index.html将

 <html>
  <head>
        <!-- build:css assets/styles/styles.css -->
    <link rel="stylesheet" type="text/css" href="bower_components/angular-autocomplete/angucomplete.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/angular-calendar/fullcalendar.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/fonts/font-awesome/css/font-awesome.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/fonts/glyphicons/css/site.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/bootstrap/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/angular-ng-table/ng-table.min.css"/>
    <link rel="stylesheet" type="text/css" href="bower_components/angular-ui-select/select.min.css" />
    <link rel="stylesheet" type="text/css" href="bower_components/styles/style.min.css"/>
    <!-- endbuild -->
 </head>
 </html>

0 个答案:

没有答案