github地址:https://github.com/Liaozhenting/template

使用的是ejs的语法.其实你用什么文件后缀都可以,都是按ejs来解析.

模板文件放在component文件夹.模板文件也可以放在其它文件夹,只要你引用的路径是对的

HTML文件放在src文件夹.(必须)

解析后输出的文件在dist文件里

在src目录下的index.html文件里引用模板

<% include ../component/head.html %>
...我的代码
<% include ../component/foot.html %>

这样就在index.html方便的复用html头部模板和脚部模板

使用

请先确定安装了Node.js

npm install
gulp dev 启动一个自动热重载的服务器,默认端口3000.浏览器可以预览目录下的页面
gulp ejs 合并模版

遍历src里面的文件,输出到dist目录.

Node.js + gulp 合并静态页模版,文件更新自动热重载。浏览器可预览的更多相关文章

  1. node.js 使用 UglifyJS2 高效率压缩 javascript 文件

    UglifyJS2 这个工具使用很长时间了,但之前都是在 gulp 自动构建 时用到了 UglifyJS 算法进行压缩. 最近玩了一下 UglifyJS2 ,做了一个 在线压缩javascript工具 ...

  2. Fenix – 基于 Node.js 的桌面静态 Web 服务器

    Fenix 是一个提供给开发人员使用的简单的桌面静态 Web 服务器,基于 Node.js 开发.您可以同时在上面运行任意数量的项目,特别适合前端开发人员使用. 您可以通过免费的 Node.js 控制 ...

  3. JS实现HTML静态页传值的方法

    JS实现HTML静态页传值的方法 作者:前端开发-武方博 发布:2012-10-29 分类:javascript 阅读:8,735次     此处使用JS方式实现静态页之间值传递,其实很简单,废话不多 ...

  4. node.js 如何处理一个很大的文件

    node.js 如何处理一个很大的文件 思路 arraybuffer 数据分段 时间分片 多线程 web workers sevice workers node.js 如何处理一个很大的文件 http ...

  5. 2.Node.js access_token的获取、存储及更新

    文章目录:         1.Node.js 接入微信公众平台开发         2.Node.js access_token的获取.存储及更新 一.写在前面的话   上一篇文章中,我们使用 No ...

  6. 使用java的 htpUrlConnection post请求 下载pdf文件,然后输出到页面进行预览和下载

    使用java的 htpUrlConnection post请求 下载pdf文件,然后输出到页面进行预览和下载 2018年06月07日 10:42:26 守望dfdfdf 阅读数:235 标签: jav ...

  7. requireJS中如何用r.js对js进行合并和压缩css文件

    我运行的环境是windows+node.js,首先是用npm安装requirejs(全局安装,即使用 'npm install requirejs -g',这样方便在各个目录调用),接着就是下载r.j ...

  8. 用node.js搭建一个静态资源站 html,js,css正确加载 跳转也完美实现!

    昨天买了一个服务器想着用来测试一些自己的项目,由于是第一次建站,在tomcat,linux,node.js间想了好久.最终因为node搭建比较方便没那么麻烦就决定用node.js来搭建网站项目. 搭建 ...

  9. 如何在Node.js中合并两个复杂对象

    通常情况下,在Node.js中我们可以通过underscore的extend或者lodash的merge来合并两个对象,但是对于像下面这种复杂的对象,要如何来应对呢? 例如我有以下两个object: ...

随机推荐

  1. MP4文件格式的解析

    MP4文件格式的解析,以及MP4文件的分割算法 mp4应该算是一种比较复杂的媒体格式了,起源于QuickTime.以前研究的时候就花了一番的功夫,尤其是如何把它完美的融入到视频点播应用中,更是费尽了心 ...

  2. python装饰器理解

    1.装饰器的作用 在不修改被装饰对象的源代码以及调用方式的前提下为被装饰对象添加新功能 原则: 1.不修改被装饰对象的源代码2.不修改被装饰对象的调用方式 目标: 为被装饰对象添加新功能 2.装饰器的 ...

  3. POI 的API大全二

    1.POI结构与常用类 (1)POI介绍 Apache POI是Apache软件基金会的开源项目,POI提供API给Java程序对Microsoft Office格式档案读和写的功能. .NET的开发 ...

  4. freemarker中的round、floor和ceiling数字的舍入处理(十七)

    1.简易说明 (1)round:四舍五入 (2)floor:向下取整 (3)ceiling:向上取整 2.举例说明 <#--freemarker中的round.floor和ceiling数字的舍 ...

  5. Hibernate中事务小案例

    理论知识: 什么是事务? 指作为单个逻辑工作单位执行的一系列操作,要么完全的执行,要么完全不执行.事务处理可以确保非事务性单元内的所有操作都完全完成,否则永久不会更新面向数据的资源.通过将一组操作组合 ...

  6. 【BZOJ2440】完全平方数(二分答案,莫比乌斯反演)

    [BZOJ2440]完全平方数(二分答案,莫比乌斯反演) 题面 BZOJ 题解 很显然,二分一个答案 考虑如何求小于等于这个数的非完全平方数倍数的个数 这个明显可以直接,莫比乌斯反演一下 然后这题就很 ...

  7. [HDU5765]Bonds

    题面 题意 给出一张\(n\)点\(m\)边无向连通图,求每条边出现在多少个割集中. \(n\le20,m\le\frac{n(n-1)}{2}\) sol 所谓割集,就是指把\(n\)个点分成两个集 ...

  8. 关于Flex的DataGridColumn 的editorDataField属性

    本人Flex菜鸟,纯纯的小白 最近在项目中提了一个需求,其实这个需求就是在原有的列表中接一列数据,只不过这一列数据是下拉列表选择的 最关键的是貌似以前的某一位大神已经添加过,我的工作就是调通,可是就是 ...

  9. c# MongoDB Driver 官方教程翻译

    先贴官方文档地址:http://mongodb.github.io/mongo-csharp-driver/2.5/getting_started/quick_tour/ 安装部分很简单,nuget搜 ...

  10. javascript 原型及原型链详解

    我们创建的每个函数都有一个 prototype (原型)属性,这个属性是一个指针,指向一个原型对象,而这个原型对象中拥有的属性和方法可以被所以实例共享. function Person(){ } Pe ...