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. python2.6升级到3.3.0 以及依赖库在迁移时的处理

    线上服务器python版本默认是2.6,由于业务程序要求,需要将python升级到3.3.0, 操作记录如下: Cenots6.8默认安装的是2.6版本,要更新升级需安装下gcc: [root@ope ...

  2. Nginx+Tomcat+Memcached部署

    环境清单列表:(因为只有三台电脑,所有把Nginx和memcached放到一起) 应用服务器1:192.168.51.10: 应用服务器2:192.168.55.110: memcached服务器:1 ...

  3. 6大爱上react 的理由

    本文翻译自:https://blog.syncano.io/reactjs-reasons-why-part-1/ 书写javascript 更加简单 (⚠️js 中混用html 也一直是外界所诟病的 ...

  4. Java读取oracle数据库中blob字段数据文件保存到本地文件(转载)

    转自:https://www.cnblogs.com/forever2698/p/4747349.html package com.bo.test; import java.io.FileOutput ...

  5. python实现线性规划

    python工具包scipy linprog 函数格式 scipy.optimize.linprog(c, A_ub=None, b_ub=None, A_eq=None, b_eq=None, bo ...

  6. 网络:Xen理解

    Xen是由剑桥大学计算机实验室开发的一个开源项目.是一个直接运行在计算机硬件之上的用以替代操作系统的软件层,它能够在计算机硬件上并发的运行多个客户操作系统(Guest OS). 一.Xen虚拟化类型 ...

  7. QQ通信机制(转)

    下面有4个基本的问答: 问题一:为什么只要可以连上互联网的计算机都可以用QQ相互建立通信,而不需要固定IP?也就是这个QQ用户端是怎样找到另一个QQ用户的,而用户在每次使用时他可能用的是不同的计算机, ...

  8. Hibernate的初次使用

    使用hibernate的四个步骤:第一:创建一个hibernate.cfg.xml.<!DOCTYPE hibernate-configuration PUBLIC "-//Hiber ...

  9. 【Alpha发布】网站已经正式发布!

    Alpha版本发布说明 一.功能介绍 本团队所做的物理实验网站是以生成物理实验报告为基础功能的网站.Alpha版本具有的功能大体如下: Figure 1首页 1. 注册登录功能 用户可以通过在注册页通 ...

  10. PAT L3-008 喊山

    https://pintia.cn/problem-sets/994805046380707840/problems/994805050709229568 喊山,是人双手围在嘴边成喇叭状,对着远方高山 ...