使用grunt js进行js的链接和压缩
1,http://nodejs.org/download/ 安装nodejs
2,配置环境变量,将nodejs的安装目录放置在Path环境变量中
3,在cmd中 npm install -g grunt-cli,如果已经安装的话npm uninstall -g grunt 这句话可以删除
4,grunt -version 可以查看是否安装成功
5,在要压缩的跟目录中创建package.json
6, 一个简单的package.json样例
{
"name": "umeditor",
"title": "umeditor",
"description": "umeditor",
"version": "1.2.2",
"homepage": "https://github.com/fex-team/umeditor",
"author": {
"name": "f-cube @ FEX",
"url": "http://fex.baidu.com"
},
"repository": {
"type": "git",
"url": "https://github.com/fex-team/umeditor.git"
},
"keywords": [
"umeditor",
"web editor",
"ueditor",
"javascript"
],
"bugs": {
"url": "https://github.com/fex-team/umeditor/issues"
},
"dependencies": {
"grunt": "~0.4.1",
"grunt-contrib-concat": "~0.3.0",
"grunt-contrib-cssmin": "~0.6.0",
"grunt-closurecompiler": "~0.9.9",
"grunt-contrib-copy": "~0.4.0",
"grunt-transcoding": "~0.1.1",
"grunt-text-replace": "~0.3.9",
"grunt-contrib-compress": "~0.7.0"
},
"devDependencies": {
"grunt": "~0.4.1",
"grunt-contrib-concat": "^0.3.0",
"grunt-contrib-uglify": "^0.5.1"
}
}
7,创建 Gruntfile.js
一个简单的样例
module.exports = function(grunt) {
grunt.initConfig({
//our JSHint options
//our concat options
concat: {
options: {
},
dist: {
src: ['Src/*.js'], //Grunt mini match for your scripts to concatenate
dest: 'dest/edit.js' //where to output the script
}
},
//our uglify options
uglify: {
js: {
files: {
'dest/edit.js': ['dest/edit.js'] //save over the newly created script
}
}
}
});
//load our tasks
//grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
// default tasks to run
grunt.registerTask('default', ['concat', 'uglify']);
//grunt.registerTask('development', ['jshint']);
//grunt.registerTask('production', ['jshint', 'concat', 'uglify']);
}
7,执行npm install grunt --save-dev 可以将最新的grunt到你的目录下
8,执行grunt 命令就实现打包了
使用grunt js进行js的链接和压缩的更多相关文章
- 使用GruntJS链接与压缩多个JavaScript文件
使用GruntJS链接与压缩多个JavaScript文件 自己写了个简单的HTML5 Canvas的图表库,可以支持饼图,折线图,散点图,盒子图 柱状图,同时支持鼠标提示,绘制过程动画效果等.最终我想 ...
- 配置grunt进行css、js的检查、合并和压缩
现在会进行代码的合并和压缩已成为前端人员的必备知识,那么现在来介绍一个grunt的工具.grunt是个风靡世界的工具,它的首页是 http://www.gruntjs.net 这是个中文网站,有文档 ...
- js获取带#号链接后的参数
现在许多的主流网站都将'#'大规模用于重要URL中,我们通过正则表达式和window.location.search获取参数已经行不通了. 一.'#'号是什么 1.#代表网页中的一个位置.其后面的字符 ...
- 使用Ant和YUICompressor链接合并压缩你的JS和CSS代码
JS代码和CSS代码在上线前要压缩大家应该都是知道的了.记得之前做项目的时候,最后要交差的时候是找了个网站,将JS代码的文件一个一个地复制,粘贴,复制,粘贴. 当时就在想:TMD有没有好一点的方法,劳 ...
- Grunt:GruntFile.js
ylbtech-Grunt:GruntFile.js 1.返回顶部 1. module.exports = function (grunt) { grunt.initConfig({ useminPr ...
- 网易云音乐JS逆向解析歌曲链接
Request URL: https://music.163.com/weapi/song/enhance/player/url?csrf_token= FormData : params: BV ...
- 一统江湖的大前端(2)—— Mock.js + Node.js 如何与后端潇洒分手
<一统江湖的大前端>系列是自己的前端学习笔记,旨在介绍javascript在非网页开发领域的应用案例和发现各类好玩的js库,不定期更新.如果你对前端的理解还是写写页面绑绑事件,那你真的是有 ...
- Python-JS (JS介绍~JS的基础数据类型)
目录一.JS语言介绍: 1.JS概念 2.JS组成 二.JS的三种存在位置(引入方式): 1.行间式: 2.内联式: 3.外联式: 三.JS出现的具体位置: 四.JS语法规范 五.JS中变量的定义 E ...
- error in static/js/xxx.js from UglifyJs Unpected token: punc() [static/js/xxx.js]
出现问题 使用vue+element-ui+webpack开发项目时,Jenkins构建出现报错error in static/js/xxx.js from UglifyJs Unpected tok ...
- html+js(swiper.js)+css左右滑动切换页面效果,适配移动端
demo: 截图: 结构:1.swiper-progress.html2.css文件夹 -swiper.css -swiper.min.css 3.js文件夹 -swiper.min.js -swip ...
随机推荐
- down
Description 给出一个数列,求出这个序列的最长下降子序列的长度及方案数,子序列中的权值完全相同视为同一个序列 Input 第一行一个整数n,接下来一行n个整数表示序列的权值 Output 一 ...
- paramiko执行命令超时的问题
问题:paramiko远程执行命令,需要等到命令返回信息,如果命令执行时间比较长,返回信息就需要等很久 方案:1.使用nohup + 待执行命令 + & ,使用后台执行的方式,应该可以快速返回 ...
- vuejs npm chromedriver 报错
vuejs npm chromedriver 报错 # 全局安装 vue-cli$ npm install -g vue-cli# 创建一个基于 "webpack" 模板的新项 ...
- Sales Team 仪表盘
实际设定值 仪表定义 <div class="oe_center" t-if="record.invoiced_ta ...
- selector的button选中处理问题
1.背景介绍 在做Android项目开发的时候,有时我们须要对button做一些特殊的处理,比方button点击的时候会有一个动画的效果,实际上就是几张图片在短时间的切换.再比方有时候我们须要对界面的 ...
- Allegro布线基本操作
转:allegro基本步骤 常见问题 cadence16.5中电源线.地线取消飞线显示 目录: 一.Allegro基本技巧 1.关闭电源和地网络的飞线 2.开启特定NET飞线 3.元器件快速对齐(待完 ...
- 关于提高沟通能力的书单zz
上周推荐了一份关于提高写作能力的书单,这周,我们来聊聊沟通能力. 在现代社会,沟通能力变得越来越重要.人与人之间的社交渠道越来越丰富,工作中的协同合作也越来越普遍.我们要沟通的人越来越多,节奏越来越快 ...
- Cocos2d-x 3.0的启动流程
Cocos2d-x 3.0变动非常大,包含启动的方式,我看了下对android的启动总结例如以下: Java方面: AppActivity继承Cocos2dxActivity Coco ...
- UiAutomator源代码分析之获取控件信息
依据上一篇文章<UiAutomator源代码分析之注入事件>開始时提到的计划,这一篇文章我们要分析的是第二点: 怎样获取控件信息 我们在測试脚本中初始化一个UiObject的时候一般是像下 ...
- Mataplotlib事例操作
刚开始需要的文件是和前边的两个连载一起的