Question

更新有多个子文件夹和html文件。每个都有他们的JS文件和css文件。目前，我正在缩小每一个，让它们保持分离。

在我的HTML代码中，有很多<link>和<script>标记。由于初始页面加载期间的多个HTTP请求，这会影响页面加载时间。我想将与一个html页面相关的所有JS和CSS文件合并为一个，并将代码更新为指向一个<script>和<link>标记。

原始问题 我需要将所有CSS和JS文件合并到一个文件中，如allcss.css和alljs.js。我正在使用grunt来缩小我的文件。有没有办法组合所有文件并更新代码以指向html代码中的allcss.css？

我想使用grunt-contrib-concat但不确定它是否会更新HTML代码。

目前我正在缩小我的个人档案，如：

cssmin: {
   minify: {
    options: {
    },
    expand: true,
    cwd: 'minifiedbuild', 
    src: '**/*.css',
    dest: 'minifiedbuild/',
    ext: '.css'
  }
 },
 uglify: {
   options: {
     mangle: {
      toplevel: true
     },
     compress: {
        global_defs: {
          'DEBUG': false
        },
        dead_code: true,
        drop_console: true,
        drop_debugger: true,
        conditionals: true,
        comparisons: true,
        toplevel: true,
        join_vars: true,
        if_return: true,
        cascade: true,
        collapse_vars: true,
        reduce_vars: true
    }
   },
   my_target: {
      files: [{
        expand: true,
        cwd: 'minifiedbuild',
        src: ['!node_modules/*.js', '**/*.js'],
        dest: 'minifiedbuild/'
      }]
    }
 },
 htmlmin: {
    dist: {                                      
      options: {                                 
        removeComments: true,
        collapseWhitespace: true,
        minifyCSS: true,
        minifyJS: true
      },
      files: [
        {
          expand: true,    
          cwd: 'minifiedbuild',      
          src: ['**/*.html'], 
          dest: 'minifiedbuild/',  
        },
  ],                
    }
 },

我不希望开发人员进行代码更改，因为这将是他们最终的一项艰巨任务。

将所有JS和CSS文件合并为一个

0 个答案: