zoukankan      html  css  js  c++  java
  • grunt 合并压缩js和css文件(二)

    具体node及文件配置请看:

    grunt 安装使用(一)

    要压缩的文件

    --src/
      ajax.js
      assets.js
      touch.js
      zepto.js

    目录结构:

    dist/
    node_modules/
    src/
    Gruntfile.js
    package.json
    package.json是依赖库文件
    Gruntfile.js是执行步骤程序

    一、js合并压缩

    第一次需要先安装grunt。执行 npm install -g grunt-cli 进行安装。如果已经安装,可以忽略。

    1.package.json文件

      安装所需要的依赖文件

    {
      "name": "grunt_test",
      "version": "1.0.0",
      "devDependencies": {
        "grunt": "^1.0.1",
        "grunt-contrib-concat": "^1.0.1",
        "grunt-contrib-uglify": "^3.0.1"
      }
    }

    安装命令:

    cnpm install grunt-contrib-concat --save-dev

     2.Gruntfile.js

    这个文件是配配置文件

    module.exports = function (grunt) {
      // 项目配置
      grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        uglify:{
          js:{
            files:[{
              expand: true,
              cwd: 'src/js',
              src: '**/*.js',
              dest: 'dist/js'
            }]
          }
        },
        concat:{
          js:{
             src: 'dist/**/*.js',
             dest: 'dist/index.min.js'
          }
        }
      });
      grunt.loadNpmTasks('grunt-contrib-uglify');
      grunt.loadNpmTasks('grunt-contrib-concat');
      // 默认任务
      grunt.registerTask('default', ['uglify', 'concat']);
    }

    这里加深的是js 要合并文件,同时需要加载模块及默认执行任务。

    执行

    grunt

    在当前目录下生成dist目录

    dist / 

    index.min.js

    同理

    css压缩也是一样的。

  • 相关阅读:
    图形
    附属信息
    文件操作
    字符编码
    Python数据类型之基础记。。。
    python并发编程之多进程
    python并发编程之多进程
    计算机基础之计算机系统的简单了解。
    元类
    基于socketserver模块实现并发tcp/udp
  • 原文地址:https://www.cnblogs.com/congxueda/p/7226416.html
Copyright © 2011-2022 走看看