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. Unhandled event loop exception No more handles

    1.错误描述 2.错误原因 3.解决办法

  2. Linux以列表格式显示块设备

    Linux以列表格式显示块设备 youhaidong@youhaidong-ThinkPad-Edge-E545:~$ lsblk -l NAME MAJ:MIN RM SIZE RO TYPE MO ...

  3. JSP路径出现问题

    1.错误描述 2.错误原因 <%@ page language="java" import="java.util.*" pageEncoding=&quo ...

  4. pat1011-1020

    一开始几道题写到吐血,真的自己现在好弱 1011 水题不说了 #include<bits/stdc++.h> using namespace std; const int N = 105; ...

  5. SpringMVC_第一个程序

    一.基本代码的完成 补充 1.在myeclipse中 WEB-INF下放的资源和WebRoot下的资源区别: WEB-INF下放到资源是不能通过浏览器直接访问的,是比较安全的,只能是后台服务端程序进行 ...

  6. 异常-----freemarker.template.TemplateException: Expected collection or sequence. datas evaluated instead to freemarker.core.HashLiteral$SequenceHash on line 7, column 18 in inc/select.ftl.

    1.错误描述 六月 26, 2014 11:26:27 下午 freemarker.log.JDK14LoggerFactory$JDK14Logger error 严重: Template proc ...

  7. 【原】spring boot添加cros全局过滤器

    新增一个过滤器类并实现filter接口 public class CorsFilter implements Filter { final static org.slf4j.Logger logger ...

  8. 促进客户转化,提高客单价!酷客多小程序发布版本V1.0.9!

    商户和企业主的又一次福音!酷客多小程序新零售o2o商城系统酷爱用户,为了追求极致的用户体验,没日没夜地沉浸于新功能的开发,经过一番努力,新功能终于上线啦! 此次版本迭代,在原有功能基础上做了大幅提升, ...

  9. 洛谷P3402 【模板】可持久化并查集(可持久化线段树,线段树)

    orz TPLY 巨佬,题解讲的挺好的. 这里重点梳理一下思路,做一个小小的补充吧. 写可持久化线段树,叶子节点维护每个位置的fa,利用每次只更新一个节点的特性,每次插入\(logN\)个节点,这一部 ...

  10. 【CJOJ2316】【模板】可持久化线段树

    题面 Description 这是一道非常直白的可持久化线段树的练习题,目的并不是虐人,而是指导你入门可持久化数据结构. 线段树有个非常经典的应用是处理RMQ问题,即区间最大/最小值询问问题.现在我们 ...