用bower-task(libs / * / *)生成的路径替换<! - bower:js - >中的bower组件路径

时间:2016-08-31 09:42:44

标签: javascript angularjs bower grunt-usemin grunt-contrib-uglify

在更换输出html文件中的bower组件路径时,我遇到了grunt,usemin和bower-task的问题。

我的html:

<!--bower:js-->
<script src="bower/jquery/dist/jquery.js"></script>
<script src="bower/angular/angular.js"></script>
<script src="bower/angular-route/angular-route.js"></script>
<script src="bower/angular-cookies/angular-cookies.js"></script>
<script src="bower/angular-ui-notification/dist/angular-ui-notification.js"></script>
<script src="bower/angular-animate/angular-animate.js"></script>
<script src="bower/ngstorage/ngStorage.js"></script>
<script src="bower/angular-sanitize/angular-sanitize.js"></script>
<script src="bower/checklist-model/checklist-model.js"></script>
<script src="bower/underscore/underscore-min.js"></script>
<script src="bower/nanoscroller/bin/javascripts/jquery.nanoscroller.js"></script>
<!-- endbower -->

我的grunt文件是:

module.exports = function(grunt) {

    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),

        bower: {
           options:{
              targetDir:'production/libs',
                  install:true
           },
           install: {

            }
       },

       useminPrepare: {
          html: 'index.html',
             options: {
                dest: 'production'
             }
       },

       usemin:{
            html:['production/index.html']
       },

       copy:{
            html: {
                 src: './index.html', dest: 'production/index.html'
            }
        }

    });

    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-contrib-copy');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-imagemin');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    grunt.loadNpmTasks('grunt-usemin');
    grunt.loadNpmTasks('grunt-bower-task');

    grunt.registerTask('default', [
        'bower:install', 'useminPrepare', 'concat', 'uglify', 'cssmin',
        'copy:html',   'usemin'
    ]);
};

当我运行 grunt 时,它会输出:

<!--bower:js-->
<script src="bower/jquery/dist/jquery.js"></script>
<script src="bower/angular/angular.js"></script>
<script src="bower/angular-route/angular-route.js"></script>
<script src="bower/angular-cookies/angular-cookies.js"></script>
<script src="bower/angular-ui-notification/dist/angular-ui-notification.js"></script>
<script src="bower/angular-animate/angular-animate.js"></script>
<script src="bower/ngstorage/ngStorage.js"></script>
<script src="bower/angular-sanitize/angular-sanitize.js"></script>
<script src="bower/checklist-model/checklist-model.js"></script>
<script src="bower/underscore/underscore-min.js"></script>
<script src="bower/nanoscroller/bin/javascripts/jquery.nanoscroller.js"></script>
<!-- endbower -->

但据我所知,它应该用bower-task生成的 libs 中的相应路径替换第一条路径,如下所示:

    <!--bower:js-->
<script src="libs/jquery/jquery.js"></script>
<script src="libs/angular/angular.js"></script>
<script src="libs/angular-route/angular-route.js"></script>
<script src="libs/angular-cookies/angular-cookies.js"></script>
<script src="libs/angular-ui-notification/angular-ui-notification.js"></script>
<script src="libs/angular-animate/angular-animate.js"></script>
<script src="libs/ngstorage/ngStorage.js"></script>
<script src="libs/angular-sanitize/angular-sanitize.js"></script>
<script src="libs/checklist-model/checklist-model.js"></script>
<script src="libs/underscore/underscore.js"></script>
<script src="libs/nanoscroller/jquery.nanoscroller.js"></script>
<!-- endbower -->

我想知道,这是我没有得到的东西,还是我做错了什么。我经历了很多以前的问题,没有一个问题帮助

0 个答案:

没有答案