Question

我已经使用webapp生成器使用yoeman启动了一个项目。

我已经安装了open layers包并将以下行添加到我的index.html

除了复制一些kml文件的引用之外，gruntfile是不变的，因为yeoman生成了它关于在哪里寻找这个问题的灵魂的任何建议。 //生成于2014-12-09使用 // generator-webapp 0.5.1 'use strict';

// # Globbing
// for performance reasons we're only matching one level down:
// 'test/spec/{,*/}*.js'
// If you want to recursively match all subfolders, use:
// 'test/spec/**/*.js'

module.exports = function (grunt) {

// Time how long tasks take. Can help when optimizing build times
require('time-grunt')(grunt);

// Load grunt tasks automatically
require('load-grunt-tasks')(grunt);

// Configurable paths
var config = {
app: 'app',
dist: 'dist'
};

// Define the configuration for all the tasks
grunt.initConfig({

// Project settings
config: config,

// Watches files for changes and runs tasks based on the changed files
watch: {
  bower: {
    files: ['bower.json'],
    tasks: ['wiredep']
  },
  js: {
    files: ['<%= config.app %>/scripts/{,*/}*.js'],
    tasks: ['jshint'],
    options: {
      livereload: true
    }
  },
  jstest: {
    files: ['test/spec/{,*/}*.js'],
    tasks: ['test:watch']
  },
  gruntfile: {
    files: ['Gruntfile.js']
  },   styles: {
    files: ['<%= config.app %>/styles/{,*/}*.css'],
    tasks: ['newer:copy:styles', 'autoprefixer']
  },
  livereload: {
    options: {
      livereload: '<%= connect.options.livereload %>'
    },
    files: [
      '<%= config.app %>/{,*/}*.html',
      '.tmp/styles/{,*/}*.css',
      '<%= config.app %>/images/{,*/}*'
    ]
  }
},

// The actual grunt server settings
connect: {
  options: {
    port: 9000,
    open: true,
    livereload: 35729,
    // Change this to '0.0.0.0' to access the server from outside
    hostname: 'localhost'
  },
  livereload: {
    options: {
      middleware: function(connect) {
        return [
          connect.static('.tmp'),
          connect().use('/bower_components', connect.static('./bower_components')),
          connect.static(config.app)
        ];
      }
    }
  },
  test: {
    options: {
      open: false,
      port: 9001,
      middleware: function(connect) {
        return [
          connect.static('.tmp'),
          connect.static('test'),
          connect().use('/bower_components', connect.static('./bower_components')),
          connect.static(config.app)
        ];
      }
    }
      },
    dist: {
    options: {
      base: '<%= config.dist %>',
      livereload: false
    }
  }
},

// Empties folders to start fresh
clean: {
  dist: {
    files: [{
      dot: true,
      src: [
        '.tmp',
        '<%= config.dist %>/*',
        '!<%= config.dist %>/.git*'
      ]
    }]
  },
  server: '.tmp'
},

// Make sure code styles are up to par and there are no obvious mistakes
jshint: {
  options: {
    jshintrc: '.jshintrc',
    reporter: require('jshint-stylish')
  },
  all: [
    'Gruntfile.js',
    '<%= config.app %>/scripts/{,*/}*.js',
    '!<%= config.app %>/scripts/vendor/*',
    'test/spec/{,*/}*.js'
  ]
},

// Mocha testing framework configuration options
mocha: {
  all: {
    options: {
      run: true,
      urls: ['http://<%= connect.test.options.hostname %>:<%= connect.test.options.port %>/index.html']
    }
  }
},
  // Add vendor prefixed styles
autoprefixer: {
  options: {
    browsers: ['> 1%', 'last 2 versions', 'Firefox ESR', 'Opera 12.1']
  },
  dist: {
    files: [{
      expand: true,
      cwd: '.tmp/styles/',
      src: '{,*/}*.css',
      dest: '.tmp/styles/'
    }]
  }
},

// Automatically inject Bower components into the HTML file
wiredep: {
  app: {
    ignorePath: /^\/|\.\.\//,
    src: ['<%= config.app %>/index.html'],
    exclude: ['bower_components/bootstrap/dist/js/bootstrap.js']
  }
},

// Renames files for browser caching purposes
rev: {
  dist: {
    files: {
      src: [
        '<%= config.dist %>/scripts/{,*/}*.js',
        '<%= config.dist %>/styles/{,*/}*.css',
        '<%= config.dist %>/images/{,*/}*.*',
        '<%= config.dist %>/styles/fonts/{,*/}*.*',
        '<%= config.dist %>/*.{ico,png}'
      ]
    }
  }
},

// Reads HTML for usemin blocks to enable smart builds that automatically
// concat, minify and revision files. Creates configurations in memory so
// additional tasks can operate on them
useminPrepare: {
  options: {
    dest: '<%= config.dist %>'
  },
  html: '<%= config.app %>/index.html'
},

// Performs rewrites based on rev and the useminPrepare configuration
usemin: {
  options: {
    assetsDirs: [
      '<%= config.dist %>',
      '<%= config.dist %>/images',
      '<%= config.dist %>/styles'
    ]
  },
  html: ['<%= config.dist %>/{,*/}*.html'],
  css: ['<%= config.dist %>/styles/{,*/}*.css']
},

// The following *-min tasks produce minified files in the dist folder
imagemin: {
  dist: {
    files: [{
      expand: true,
      cwd: '<%= config.app %>/images',
      src: '{,*/}*.{gif,jpeg,jpg,png}',
      dest: '<%= config.dist %>/images'
    }]
  }
},

svgmin: {
  dist: {
    files: [{
      expand: true,
      cwd: '<%= config.app %>/images',
      src: '{,*/}*.svg',
      dest: '<%= config.dist %>/images'
    }]
  }
},
  htmlmin: {
  dist: {
    options: {
      collapseBooleanAttributes: true,
      collapseWhitespace: true,
      conservativeCollapse: true,
      removeAttributeQuotes: true,
      removeCommentsFromCDATA: true,
      removeEmptyAttributes: true,
      removeOptionalTags: true,
      removeRedundantAttributes: true,
      useShortDoctype: true
    },
    files: [{
      expand: true,
      cwd: '<%= config.dist %>',
      src: '{,*/}*.html',
      dest: '<%= config.dist %>'
    }]
  }
   },

// By default, your `index.html`'s <!-- Usemin block --> will take care
// of minification. These next options are pre-configured if you do not
// wish to use the Usemin blocks.
// cssmin: {
//   dist: {
//     files: {
//       '<%= config.dist %>/styles/main.css': [
//         '.tmp/styles/{,*/}*.css',
//         '<%= config.app %>/styles/{,*/}*.css'
//       ]
//     }
//   }
// },
// uglify: {
//   dist: {
//     files: {
//       '<%= config.dist %>/scripts/scripts.js': [
//         '<%= config.dist %>/scripts/scripts.js'
//       ]
//     }
//   }
// },
// concat: {
//   dist: {}
// },

// Copies remaining files to places other tasks can use
copy: {
  dist: {
    files: [{
      expand: true,
      dot: true,
      cwd: '<%= config.app %>',
      dest: '<%= config.dist %>',
      src: [
        '*.{ico,png,txt}',
        'images/{,*/}*.webp',
        '{,*/}*.html',
        'styles/fonts/{,*/}*.*',
        'kmlfiles/{,*/}*.kml'
      ]
    }, {
      src: 'node_modules/apache-server-configs/dist/.htaccess',
      dest: '<%= config.dist %>/.htaccess'
    }, {
      expand: true,
      dot: true,
      cwd: 'bower_components/bootstrap/dist',
      src: 'fonts/*',
       dest: '<%= config.dist %>'
    }]
  },
  styles: {
    expand: true,
    dot: true,
    cwd: '<%= config.app %>/styles',
    dest: '.tmp/styles/',
    src: '{,*/}*.css'
  }
},

// Run some tasks in parallel to speed up build process
concurrent: {
  server: [
    'copy:styles'
  ],
  test: [
    'copy:styles'
  ],
  dist: [
    'copy:styles',
    'imagemin',
    'svgmin'
  ]
}
});

Answer 1

由于您没有显示更改的HTML文件，我只能假设您将引用放在bower / endbower标记之间。你的grunt wiredep taks会用安装了凉亭的模块替换这些标签之间的所有内容。

grunt服务删除index.html中对openlayers.js的引用

1 个答案: