JS模块化开发(二)——构建工具grunt
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的更多相关文章
- Js模块化开发--seajs和gruntJs
1.Seajs库 解决开发中的冲突依赖等问题,提供代码可维护性. SeaJS 是由玉伯开发的一个遵循 CommonJS 规范的模块加载框架,可用来轻松愉悦地加载任意 JavaScript 模块和css ...
- JS模块化开发:使用SeaJs高效构建页面
一.扯淡部分 很久很久以前,也就是刚开始接触前端的那会儿,脑袋里压根没有什么架构.重构.性能这些概念,天真地以为前端===好看的页面,甚至把js都划分到除了用来写一些美美的特效别无它用的阴暗角落里,就 ...
- 前端开发自动化工作流工具,JavaScript自动化构建工具grunt、gulp、webpack介绍
前端开发自动化工作流工具,JavaScript自动化构建工具grunt.gulp.webpack介绍 前端自动化,这样的一个名词听起来非常的有吸引力,向往力.当今时代,前端工程师需要维护的代码变得及为 ...
- JS模块化开发(三)——seaJs+grunt
1.seaJs直接构建存在的问题 由于模块之间的依赖require引用的是模块名,当多个js模块被合并成一个时,会由于找不到模块名而报错 2.seaJs+grunt开发 用到的插件:grunt-cmd ...
- 前端项目构建工具---Grunt
什么是Grunt? grunt是javascript项目构建工具,在grunt流行之前,前端项目的构建打包大多数使用ant.(ant具体使用 可以google),但ant对于前端而言,存在不友好,执行 ...
- JavaScript自动化构建工具grunt、gulp、webpack介绍
前端开发自动化工作流工具,JavaScript自动化构建工具grunt.gulp.webpack介绍 前端自动化,这样的一个名词听起来非常的有吸引力,向往力.当今时代,前端工程师需要维护的代码变得及为 ...
- JS模块化开发----require.js
前言 前端开发中,起初只要在script标签中嵌入几十上百行代码就能实现一些基本的交互效果,后来js得到重视,应用也广泛起来了,jQuery,Ajax,Node.Js,MVC,MVVM等的助力也使得前 ...
- Js模块化开发的理解
Js模块化开发的理解 模块化是一个语言发展的必经之路,其能够帮助开发者拆分和组织代码,随着前端技术的发展,前端编写的代码量也越来越大,就需要对代码有很好的管理,而模块化能够帮助开发者解决命名冲突.管理 ...
- JS模块化开发(四)——构建工具gulp
gulp.js——基于流的自动化构建工具 步骤: 1. 全局安装 gulp: $ npm install --global gulp 2. 作为项目的开发依赖(devDependencies)安装: ...
随机推荐
- visual studio 2013的使用和单元测试
Visual Studio 2013 是一个先进的开发解决方案,各种规模的团队通过它均可设计和创建引人注目的应用程序.Visual Studio 13在新功能包括C#和VB编译器和IDE支持完全基于. ...
- Linux内核分析 期末总结
Linux内核分析 期末总结 一.知识概要 1. 计算机是如何工作的 存储程序计算机工作模型:冯诺依曼体系结构 X86汇编基础 会变一个简单的C程序分析其汇编指令执行过程 2. 操作系统是如何工作的 ...
- HTML编码规则
<!DOCTYPE html><!-- 为每一个HTML页面的第一行添加标准模式 --> <html lang="en-us"> <!-- ...
- Python学习笔记 ---第三章
函数 函数是代码的一种抽象 函数 说明 abs 绝对值 max 最大值 hex 转换为16进制 强制数据类型转换 int('123') 123 int(12.35) 12 srt(100) '100' ...
- java注解的简单介绍
什么是注解 1.注解就是Annontation,Annontation是Java5开始引入的新特征,中文名称叫做注解,它提供了一种安全的类似注释的机制,可以起到减少配置的成果,给程序起到辅助性的作用 ...
- 使用Java+Kotlin双语言的LeetCode刷题之路(三)
BasedLeetCode LeetCode learning records based on Java,Kotlin,Python...Github 地址 序号对应 LeetCode 中题目序号 ...
- Java实现小学四则运算练习系统(UI)
github项目地址 :https://github.com/feser-xuan/Arithmetic_test3_UI 小伙伴的博客链接:http://www.cnblogs.com/fukang ...
- PHP文件下载功能实现
客户端的浏览器通过HTTP协议可以实现文件下载: 方法一: 能提供用户下载的最简单的方法就是使用一个<a></a>标签,比如在页面中添加这么一行代码 <a href=&q ...
- [转帖]Marvell兵败中国4G 创始人去职未来几何
Marvell兵败中国4G 创始人去职未来几何 (2016-04-12 09:08:30) 2016年的帖子. http://blog.sina.com.cn/s/blog_1542ef86c0102 ...
- python文件逐行读取四种方法
下面是四种Python逐行读取文件内容的方法, 并分析了各种方法的优缺点及应用场景,以下代码在python3中测试通过, python2中运行部分代码已注释,稍加修改即可. 方法一:readline函 ...