很长时间没有更新博客了,实在是太忙啦...0.0 ,以下的东西纯粹是记录,不是我原创,放到收藏夹还担心不够,这个以后常用,想来想去,还是放到这里吧,,丢不了..最后一句废话,网上搜集也好原创也罢,能解决问题不糊弄人才是真道理!反正我的问题解决啦!!!哈哈哈!!安装grunt原文: ...
很长时间没有更新博客了,实在是太忙啦...0.0 ,以下的东西纯粹是记录,不是我原创,放到收藏夹还担心不够,这个以后常用,想来想去,还是放到这里吧,,丢不了..最后一句废话,网上搜集也好原创也罢,能解决问题不糊弄人才是真道理!
反正我的问题解决啦!!!哈哈哈!!
安装grunt
原文:www.bluesdream.com/blog/windows-installs-the-grunt-and-instructions.html
怕这个网址打不开,记录下:
安装Grunt:
方法二:手动创建package.json文件,添加项目/模块的描述信息:
附:
注:devDependencies里面的参数,指定了项目依赖的Grunt和Grunt插件版本。其中"~0.7.0"代表安装该插件的某个特定版本,如果只需安装最新版本,可以改成"*"。
然后执行:
执行配置中所有的任务:
devDependencies中的grunt在前一篇已经安装了,grunt-contrib-jshint/grunt-contrib-uglify/grunt-contrib-concat则没有安装。三个分别对于三个任务(task)
- grunt-contrib-jshint js语法检查
- grunt-contrib-uglify 压缩,采用UglifyJS
- grunt-contrib-concat 合并文件
此时,打开命令行工具进入到项目根目录,敲如下命令: npm install
项目和任务配置载入grunt插件和任务定制执行任务
该示例完成以下任务
- 合并src下的文件(ajax.js/selector.js)为domop.js
- 压缩domop.js为domop.min.js
- 这两个文件都放在dest目录下
最终的Gruntfile.js如下
四、执行grunt任务
打开命令行,进入到项目根目录,敲 grunt
从打印信息看出成功的合并和压缩并生成了dest目录及期望的文件,这时的项目目录下多了dest,如下
ok,这里介绍了2个常见任务concat和uglify,jshint等没有介绍。Gruntfile.js里的代码也没有一一解读,感兴趣的同学可在gruntjs的官方文档找到。
以上内容,应该没有侵犯大婶们的版权吧,真的sorry,我其实就是个接地气的屌丝,政治也没学好,此外,万分感谢上面这位sandy大神解决了我的问题,还有第一篇文章的那个英雄,感谢上帝,感谢佛祖,感谢cctv,感谢mtv,感谢中国气象台...这块有啥问题,大家一起切切搓搓哈...
本来废话说完了,发现漏掉一个很重要的,其实spm也罢 grunt也好,个人觉得难点还在配置,最近在重构公司前端的架构,研究这个seajs的东东,上面的那个grunt的确好使,下面把我找到的这个文章也粘贴过来,里面的配置很全,感觉挺重要..
标题是:使用Grunt 打包 SeaJS 实例,网上可以搜到这个文章,给个地址吧 blog.sina.com.cn/s/blog_84ff74720102vhjk.html 就是怕哪天这个地址404了,所以我还是在搞过来吧,放心 index.html :如果能保证正常运行,开始打包吧! Gruntfile.js:进入 application 目录 运行 npm install 安装依赖, 然后再 运行 grunt
这时辰你将获得一个紧缩过的__build/xxx.js文件
归并JS文件
若是将JS文件中require的其他模块都归并到这个文件中,我们可以加上--combine参数
你将与上方一样获得一个__build/xxx.js文件,然则这个js中require的模块也都归并在这个文件中了
归并JS文件的规矩
一般说来,前端优化时,并非链接数越少越好,对于通用JS类库,因为在多个页面中都邑被引用,零丁加载可以哄骗到浏览器缓存
spm在归并时,也推敲到了这种景象,是以它遵守如许一个规矩,即只归并require的“相对标识”的模块,而不归并require的“标识”的模块
输出文件路径
默认景象下,spm会把文件输出到当前文件同级的__build子文件夹下,在以上几点的例子里面已经看到了
以上号令会将当前的xxx.js调换为归并后的
app_path参数
以上的评论辩论,都是假设JS文件位于“根”下面,也就是说
明显这是有题目,我们期望编译出的id应当是http://x.com/javascript/xxx.js,假设路径再深一点,若是存在两个同名而目次不合的js,就会存在define id反复了
这时辰因为out_path为. 所以xxx.js已经被调换掉了,打开辟明define id正确无误,是http://x.com/javascript/xxx.js
当你在某个目次下履行spm build号令时,spm会主动寻找当前目次下有没有build-config.js文件,若是有则将内容解析为参数
海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com
原标题:折腾一两天,终于学会使用grunt压缩合并混淆JS脚本,小激动,特意记录一下+spm一点意外收获
关键词:JS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:
admin#shaoqun.com
(#换成@)。