我们的项目wecash4.0的前端构建考虑过用fis和grunt.

目录:

　　前期调研:fis vs grunt vs gulp?

　　一.安装grunt和项目.

fis是百度fex研发的构建工具,非常方便,非常强大.

简单的几句代码就可以完成对项目的构建.

但是,fis它那个自动更新引用资源的名字的功能有个问题就是它更新后的名字都是绝对路径的,比如原来是这么引用的<script src="index.js" />,现在被它构建后成了<script src="/index.js">,这样当你的项目是放在二级域名的个根目录下的文件夹,比如是book.douban.com的时候你就会发现你所有对引用资源的引用的路径都不正确了,报404了.

虽然它官方说有个设置可以改变 这个(把引用路径都设置成绝对路径),但是我找了一通之后还是没弄好.

所以但是我们最后还是决定不用fis.

我们决定用grunt-这个当前业界最流行的构建工具(

千辛万苦,终于可以对js文件添加md5戳而且在所有页面找到引用的js文件而且更新成他们添加md5戳后的名字,但是仔细一看,诶,不对,居然只有每个页面最后一个脚本的文件被更新了.

二.写配置文件.

用grunt进行前端工程化之路的更多相关文章

  1. Fis3的前端工程化之路[三大特性篇之声明依赖]

    Fis3版本:v3.4.22 Fis3的三大特性 资源定位:获取任何开发中所使用资源的线上路径 内容嵌入:把一个文件的内容(文本)或者base64编码(图片)嵌入到另一个文件中 依赖声明:在一个文本文 ...

  2. Fis3的前端工程化之路[三大特性篇之内容嵌入]

    Fis3版本:v3.4.22 Fis3的三大特性 资源定位:获取任何开发中所使用资源的线上路径 内容嵌入:把一个文件的内容(文本)或者base64编码(图片)嵌入到另一个文件中 依赖声明:在一个文本文 ...

  3. Fis3的前端工程化之路[三大特性篇之资源定位]

    Fis3版本:v3.4.22 Fis3的三大特性 资源定位:获取任何开发中所使用资源的线上路径 内容嵌入:把一个文件的内容(文本)或者base64编码(图片)嵌入到另一个文件中 依赖声明:在一个文本文 ...

  4. 前端工程化开发之yeoman、bower、grunt

    上两遍文章介绍了前端模块化开发(以seaJs为例)和前端自动化开发(以grunt为例)的流程,参见: http://www.cnblogs.com/luozhihao/p/4818782.html ( ...

  5. 前端工程化系列[04]-Grunt构建工具的使用进阶

    在前端工程化系列[02]-Grunt构建工具的基本使用和前端工程化系列[03]-Grunt构建工具的运转机制这两篇文章中,我们对Grunt以及Grunt插件的使用已经有了初步的认识,并探讨了Grunt ...

  6. 前端工程化系列[03]-Grunt构建工具的运转机制

    在前端工程化系列[02]-Grunt构建工具的基本使用这篇文章中,已经对Grunt做了简单的介绍,此外,我们还知道了该如何来安装Grunt环境,以及使用一些常见的插件了,这篇文章主要介绍Grunt的核 ...

  7. [转]基于gulp和webpack的前端工程化

    本文样例代码 :https://github.com/demohi/learning-gulp 本文主要简单介绍一下基于gulp和webpack的前端工程化. 技术栈 React.js reFlux ...

  8. 基于webpack的前端工程化开发解决方案探索（一）：动态生成HTML（转）

    1.什么是工程化开发 软件工程的工程化开发概念由来已久,但对于前端开发来说,我们没有像VS或者eclipse这样量身打造的IDE,因为在大多数人眼中,前端代码无需编译,因此只要一个浏览器来运行调试就行 ...

  9. 一个「学渣」从零开始的Web前端自学之路

    从 13 年专科毕业开始,一路跌跌撞撞走了很多弯路,做过餐厅服务员,进过工厂干过流水线,做过客服,干过电话销售可以说经历相当的“丰富”. 最后的机缘巧合下,走上了前端开发之路,作为一个非计算机专业且低 ...

随机推荐

  1. jQuery判断键盘按下的keyCode

    $("div").keydown(function(event) { var keyCode = event.keyCode; //根据keycode判断按下的是哪个键 });

  2. bonext.js学习笔记

    bonext.js是个什么鬼? 首先这是一个前端开发框架,建立在Backbone.js的基础上,使用Jquery操作Dom,Bootstrap负责布局,Art-Template渲染模板,再加上自定义一 ...

  3. tcp协议头窗口，滑动窗口，流控制，拥塞控制关系

    参考文章 TCP 的那些事儿(下) http://coolshell.cn/articles/11609.html tcp/ip详解--拥塞控制 & 慢启动 快恢复 拥塞避免 http://b ...

  4. 我现在的vimrc配置文件

    runtime! debian.vim "设置编码 set encoding=utf- set fencs=utf-,ucs-bom,shift-jis,gb18030,gbk,gb2312 ...

  5. re正则表达式

    1.matchimport rem = re.match("[0-9]{0,10}","7564565abcdefg") #match从开头开始匹配if m: ...

  6. Mysql 第一天

    数据库课程体系 在PHP阶段,将数据库分为三个阶段: 基础阶段(就业班第一个阶段): 6天, mysql数据库的基本操作(增删改查), 以及一些高级操作(视图, 触发器,函数,存储过程等), 和PHP ...

  7. 第六百一十七天 how can I 坚持

    没什么特长,唯一有的仅是妄想,哈哈,真逗. 明天就去新项目组了,会接触些新东西吧,啊,挺好,一开始压力大点很正常,但不要放弃啊. 搞不懂我自己啊,貌似不上火了呢. 睡觉了.忘不掉.做不到.

  8. jenkins调度selenium脚本不打开浏览器解决办法

    原文地址: http://blog.csdn.net/achang21/article/details/45096003 The web browser doesn't show while run ...

  9. calculator

    #include <stdio.h> #include <stdlib.h> typedef enum { FALSE = , TRUE }BOOL; void calcula ...

  10. 在php中防止SQL注入的方法

    摘要:我们php手手工安装的,php的默认配置文件在 /usr/local/apache2/conf/php.ini,我们最主要就是要配置php.ini中的内容,让我们执行 php能够更安全.整个PH ...