gruntJs——构建工具:代码压缩、文件合并

安装流程:

1.到nodeJs官网下载安装nodeJs(附带了npm包管理工具)

2.cmd命令行:npm install -g grunt-cli // 全局安装

       npm install grunt --save-dev    //作为项目的开发依赖(devDependencies)安装

       grunt -version    //查看版本号(检查是否安装成功)

文件合并:

1.在需要合并的文件同一级创建package.json配置文件(内容见grunt官网教程),在其中引入所需插件,例如合并插件contrib-concat.

2.打开cmd,进入项目目录(先进入对应磁盘,比如"f:",回车,再用“cd ......”)

3.回车,npm install,生成node_modules文件夹(里面包括了所需插件)

4.同级目录创建Gruntfile.js文件(内容见grunt官网教程和相应插件使用规则)

5.cmd下命令:grunt(如果Gruntfile.js中给task取了名字,则为grunt -name)    【合并完成】

JS模块化开发(二)——构建工具grunt的更多相关文章

  1. Js模块化开发--seajs和gruntJs

    1.Seajs库 解决开发中的冲突依赖等问题,提供代码可维护性. SeaJS 是由玉伯开发的一个遵循 CommonJS 规范的模块加载框架,可用来轻松愉悦地加载任意 JavaScript 模块和css ...

  2. JS模块化开发:使用SeaJs高效构建页面

    一.扯淡部分 很久很久以前,也就是刚开始接触前端的那会儿,脑袋里压根没有什么架构.重构.性能这些概念,天真地以为前端===好看的页面,甚至把js都划分到除了用来写一些美美的特效别无它用的阴暗角落里,就 ...

  3. 前端开发自动化工作流工具,JavaScript自动化构建工具grunt、gulp、webpack介绍

    前端开发自动化工作流工具,JavaScript自动化构建工具grunt.gulp.webpack介绍 前端自动化,这样的一个名词听起来非常的有吸引力,向往力.当今时代,前端工程师需要维护的代码变得及为 ...

  4. JS模块化开发(三)——seaJs+grunt

    1.seaJs直接构建存在的问题 由于模块之间的依赖require引用的是模块名,当多个js模块被合并成一个时,会由于找不到模块名而报错 2.seaJs+grunt开发 用到的插件:grunt-cmd ...

  5. 前端项目构建工具---Grunt

    什么是Grunt? grunt是javascript项目构建工具,在grunt流行之前,前端项目的构建打包大多数使用ant.(ant具体使用 可以google),但ant对于前端而言,存在不友好,执行 ...

  6. JavaScript自动化构建工具grunt、gulp、webpack介绍

    前端开发自动化工作流工具,JavaScript自动化构建工具grunt.gulp.webpack介绍 前端自动化,这样的一个名词听起来非常的有吸引力,向往力.当今时代,前端工程师需要维护的代码变得及为 ...

  7. JS模块化开发----require.js

    前言 前端开发中,起初只要在script标签中嵌入几十上百行代码就能实现一些基本的交互效果,后来js得到重视,应用也广泛起来了,jQuery,Ajax,Node.Js,MVC,MVVM等的助力也使得前 ...

  8. Js模块化开发的理解

    Js模块化开发的理解 模块化是一个语言发展的必经之路,其能够帮助开发者拆分和组织代码,随着前端技术的发展,前端编写的代码量也越来越大,就需要对代码有很好的管理,而模块化能够帮助开发者解决命名冲突.管理 ...

  9. JS模块化开发(四)——构建工具gulp

    gulp.js——基于流的自动化构建工具 步骤: 1. 全局安装 gulp: $ npm install --global gulp 2. 作为项目的开发依赖(devDependencies)安装: ...

随机推荐

  1. 对于League of Legends的分析

    League of Legends是一款在国内甚至国际上都很受欢迎的一款网络竞技行的游戏.它是由美国Riot Games开发,腾讯游戏运营的英雄对战网游.<英雄联盟>除了即时战略.团队作战 ...

  2. 2-Twentieth Scrum Meeting-20151220

    任务安排 成员 今日完成 明日任务 闫昊 请假(数据库)   唐彬 请假(数据库)   史烨轩  尝试使用downloadmanager对notification进行更新  尝试使用downloadm ...

  3. 《Linux内核设计与实现》第4章读书整理

    第四章   进程调度 4.1多任务 无论在单处理器或者多处理机器上,多任务操作系统都能使多个进程处于堵塞或者睡眠状态. 非抢占式多任务:除非进程自己主动停止运行,否则它会一直执行. 抢占式多任务:进程 ...

  4. vue容易混淆的点小记

    computed.methods及watch函数的差异 computed:基于依赖进行缓存,若依赖不变,则直接调用缓存(适用于性能开销比较大的时候) methods: 不管数据是否变更,都会进行计算( ...

  5. 数组操作方法(包括es5)

    //push(); 定义:可以可向数组的末尾添加一个或更多元素,并返回新的长度. 方法:push(); 语法:数组.push(新元素1,新元素2,....,新元素x) 返回值:把指定的值添加到数组后的 ...

  6. [转帖]Tomcat目录结构详解

    Tomcat目录结构详解 https://www.cnblogs.com/veggiegfei/p/8474484.html 之前应该是知道一点 但是没有这么系统 感谢原作者的描述. 1.bin: 该 ...

  7. [CB转帖]台湾晶圆厂产能居全球第一 大陆排名第五但增长最多

    台湾晶圆厂产能居全球第一 大陆排名第五但增长最多 据台湾地区媒体报道,近日市场调查机构IC Insights发布了各个地区或国家晶圆厂月产能排名,其中台湾地区排名第一,韩国排名第二,日本排名第三,美国 ...

  8. [kali] 安装完kali之后允许远程ssh

    1. 安装kali 2.控制台登录kali 3. 修改 /etc/ssh/sshd_config 4.将 permitrootlogin 前面的注释去掉,并且后面改为yes 5.然后重启ssd服务 / ...

  9. js控制浏览器全屏

    HTML 5中的full screen,目前可以在除IE和opera外的浏览器中使用 ,有的时候用来做全屏API,游戏呀,等都很有用.先看常见的API element.requestFullScree ...

  10. mysql登录密码相关

    设置root登录密码 方法一:用root 进入mysql后 mysql>set password =password('你的密码'); mysql>flush privileges; 方法 ...