原文：HTML 代码复用实践

上面的链接里面安装配置步骤已经非常详细，这里主要记录我操作过程中遇到的几个问题

gulp-file-include 的使用

    按上面的步骤安装之后，node_modules下会有gulp和gulp-file-include

   

    还有一个我们创建的空的gulp-file-include文件

在gulp-file-include中组织文件目录（把下载的gulp、gulp-file-include加进来）

配置gulpfile.js(gulp、gulp-file-include和gulpfile.js同一级目录下)

src下的include文件夹放公共部分的html（或者说放模板），模板里面没有html、head、title、body标记

公共页面被引入之后出现中文乱码的问题

 

运行文件之后,在dist文件中会生成编译之后的文件

要修改文件的时候，修改src里面的原文件，然后再重新运行一遍，重新生成新文件

HTML 代码复用实践 （静态页面公共部分提取复用）的更多相关文章

  1. HTML 代码复用实践

    前言 通常我们所做的一些页面,我们可以从设计图里面看出有一些地方是相同的.例如:头部,底部,侧边栏等等.如果是制作静态页面的同学,对于这些重复的部分只能够通过复制粘贴到新的页面来,如果页面的数量上去了 ...

  2. PHP代码为什么不能直接保存HTML文件——>PHP生成静态页面教程

    1.server会依据文件的后缀名去进行解析,假设是HTML文件则server不会进行语法解析.而是直接输出到浏览器. 2.假设一个页面中所有都是HTML代码而没有须要解析的PHP语法,则没有必要保存 ...

  3. 静态页面如何实现 include 引入公用代码

    一直以来,我司的前端都是用 php 的 include 函数来实现引入 header .footer 这些公用代码的,就像下面这样: <!-- index.php --> <!DOC ...

  4. PHP代码为什么不能直接保存HTML文件——>PHP生成静态页面教程

    1.服务器会根据文件的后缀名去进行解析,如果是HTML文件则服务器不会进行语法解析,而是直接输出到浏览器. 2.如果一个页面中全部都是HTML代码而没有需要解析的PHP语法,则没有必要保存为PHP文件 ...

  5. velocity生成静态页面代码

    首先需要必备的jar包: web.xml <!-- load velocity property --> <servlet> <servlet-name>veloc ...

  6. 美团外卖Android平台化的复用实践

    美团外卖平台化复用主要是指多端代码复用,正如美团外卖iOS多端复用的推动.支撑与思考文章所述,多端包含有两层意思:其一是相同业务的多入口,指美团外卖业务需要在美团外卖App(下文简称外卖App)和美团 ...

  7. 浅谈php生成静态页面

    一.引 言 在速度上,静态页面要比动态页面的比方php快很多,这是毫无疑问的,但是由于静态页面的灵活性较差,如果不借助数据库或其他的设备保存相关信息的话,整体的管理上比较繁琐,比方修改编辑.比方阅读权 ...

  8. 比较详细PHP生成静态页面教程

    一,PHP脚本与动态页面. PHP脚本是一种服务器端脚本程序,可通过嵌入等方法与HTML文件混合, 也可以类,函数封装等形式,以模板的方式对用户请求进行处理.无论以何种方式,它的基本原理是这样的.由客 ...

  9. 敏捷开发中高质量 Java 代码开发实践

    Java 项目开发过程中,由于开发人员的经验.代码风格各不相同,以及缺乏统一的标准和管理流程,往往导致整个项目的代码质量较差,难于维护,需要较大的测试投入 和周期等问题. 这些问题在一个项目组初建.需 ...

随机推荐

  1. [转]Mathematical Induction --数学归纳法1

    Mathematical Induction Mathematical Induction is a special way of proving things. It has only 2 step ...

  2. 一周学会go语言并应用 by王奇疏

    <一周学会go语言并应用> by王奇疏 ( 欢迎加入go语言群: 218160862 , 群内有实践) 点击加入 零.安装go语言,配置环境及IDE 这部分内容不多,请参考我的这篇安装环境 ...

  3. jQuery：cookie插件的使用

    Jquery插件就是在Jquery基础之上,开发的基于Jquery的javascript库. 在Jquery中,引入cookie插件后,可以很方便的定义某个cookie的名称,并设置cookie值.通 ...

  4. [原创]IIS7.5下配置ASP+PHP环境及错误处理（0xc0000135）

    IIS7.5下配置ASP+PHP环境及错误处理(0xc0000135) http://user.qzone.qq.com/93701178/blog/1398155812 操作系统更新至Win7或Wi ...

  5. 学习maple

    定义函数:$f:=(x,y) \rightarrow x^2+y^2$ 类似mathematica的manipulate功能:plots[animate](plot,[f(x,y),x=0..1],y ...

  6. 1password密码库格式更新

    由于国内网络安全做的太差,经常发生被脱裤的事件,比如最近的网易邮箱(via 乌云),所以只好用1password这类密码管理软件,实现一站一密.昨晚半夜冻醒了,刷推刷到了这个:1password-le ...

  7. 获取地址上的ID（页面与服务器的交互）

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  8. win7系统.LNK类型文件打开方式的修复办法

    1.首先 win+r 2.打开运行程序 3.输入: regedit 4.找到: 计算机\HKEY_CURRENT_USER\SOFTWARE\MICROSOFT\WINDOWS\currentvers ...

  9. Spring Boot 框架@Temporal(TemporalType.DATE)

    使用spring boot框架开发项目时,遇到这样一个问题: 查询pgSQL数据库中表A中某date数据类型的列B,想得到YYYY-MM-DD格式的日期,结果返回的为时间戳(长整型数据). 解决办法: ...

  10. iOS与JS交互实战篇（ObjC版）

    前言 ObjectiveC与Js交互是常见的需求,可对于新手或者所谓的高手而言,其实并不是那么简单明了.这里只介绍iOS7.0后出来的JavaScriptCore framework. 关于JavaS ...