zoukankan      html  css  js  c++  java
  • grunt 打包 分解(并非原创)

    1. require('time-grunt')(grunt);

    Time how long tasks take. Can help when optimizing build times任务执行时间方便时间上的优化
    2. require('jit-grunt')(grunt, {
    useminPrepare: 'grunt-usemin',
    ngtemplates: 'grunt-angular-templates',
    cdnify: 'grunt-google-cdn'
    });
    自动加载所需任务
     
    3. useminPrepare
    useminPrepare: {
    html: ['<%= yeoman.app %>/{,**/}*.html'],
    options: {
    dest: '<%= yeoman.dist %>',
    flow: {
    html: {
    steps: {
    js: ['concat', 'uglifyjs'], //用UglifyJS方式压缩JS文件
    css: ['cssmin']
    },
    post: {}
    }
    }
    }
    }
    根据 <%= yeoman.app %>/index.html 中的 usemin 块生成 JS 和 CSS 的压缩配置,并指定输出路径为 <%= yeoman.dist %> 。
     
    4. ngtemplates
    配置模板(template)到$tempalteCach, angular 直接在cache中读取,加快前端的速度。
    5. cdnify
    将本地路径改成cdn路劲
    6. watch
    监听文件的变化
    7. wiredep
    用来根据 bower.json 在指定文件的占位符中注入 JavaScript 或者 CSS 依赖。 
    8. filerev
    重命名
    9. usemin
    基于被压缩和重命名过的文件重写html,link路径
    10. jshint/jscs
    js语法检测/js代码风格检测
    11. clean
    清除模块 .tmp文件
    12. postcss
    css前缀自动补全
    13. ngAnnotate
    annotate()方法可以帮助$injector判断哪些服务会在函数被调用时注入进去
    14. concurrent
    用于运行并行任务。对于耗时的任务(如 Coffee and Sass)或者运行 多个阻塞任务 (如 nodemon and watch ) 时很有用。
  • 相关阅读:
    仿京东实现购物车页面中结算的动态滚动效果
    css reset的重置作用(可取还是不可取,取决于你)
    动态获取半弧的高度
    对话框以及延伸的时间轴展示
    移动前端meta
    解决相关css基础问题
    根据屏幕高度自适应页面高度
    数组比大小
    微信小程序如何解析html内容
    js调用局部打印功能并还原
  • 原文地址:https://www.cnblogs.com/cxcoder/p/9067515.html
Copyright © 2011-2022 走看看