我们的项目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. Struts2 XML配置详解

    struts官网下载地址:http://struts.apache.org/   1.    深入Struts2的配置文件 本部分主要介绍struts.xml的常用配置. 1.1.    包配置: S ...

  2. Ninject之旅之二：开始使用Ninject（附程序下载）

    摘要 这篇文章介绍怎样将Ninject添加到实际的项目中,使用Ninject框架最基本的功能.首先用一个Hello World例子介绍怎么添加和使用Ninject.然后用一个更复杂的例子,介绍Ninj ...

  3. js错误：TypeError $(...) is null

    转载自:http://www.phpernote.com/jquery/851.html:

  4. MAXIMO-修改菜单

    MAXIMO菜单修改 模块: select * from MAXMODULES; -- 查询模块 一级菜单(应用程序):  select * from MAXMENU where MENUTYPE=' ...

  5. 填坑*** WARNING L15: MULTIPLE CALL TO SEGMENT

    填坑*** WARNING L15: MULTIPLE CALL TO SEGMENT 警告:发生了重入! 解释:在主循环里调用了一个函数,而在中断服务中又一次调用了同样的函数.当主循环运行到该函数中 ...

  6. android第二天（项目的组成结构）

    1:src文件夹分析: helloWorld----src(源码文件夹) MainActivity:主界面类----gen(自动生成的源码文件夹) R.java:对应res文件夹 下面又包含三个内部类 ...

  7. GridView 使用方法总结

    http://www.cnblogs.com/sufei/archive/2010/03/27/1698590.html  地址

  8. Linux 之集群 LVS

    查看系统是否支持IPVS功能 [root@nginx ~]# grep -i 'ipvs' /boot/config-2.6.18-308.el5 # IPVS transport protocol ...

  9. C语言的文法分析

    <程序>  ->   <声明> | <程序> <函数> <声明>  ->   #include<stdio.h>|# ...

  10. 【231】◀▶ 利用 IDL 读取 TIFF 数据

    参考:Create Latitude/Longitude Arrays for GeoTIFF Image 用到的函数为 READ_TIFF,通过此函数可以获取 TIFF 数据的数组信息,同时可以获取 ...