Node.js + gulp 合并静态页模版,文件更新自动热重载。浏览器可预览
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 合并静态页模版,文件更新自动热重载。浏览器可预览的更多相关文章
- node.js 使用 UglifyJS2 高效率压缩 javascript 文件
UglifyJS2 这个工具使用很长时间了,但之前都是在 gulp 自动构建 时用到了 UglifyJS 算法进行压缩. 最近玩了一下 UglifyJS2 ,做了一个 在线压缩javascript工具 ...
- Fenix – 基于 Node.js 的桌面静态 Web 服务器
Fenix 是一个提供给开发人员使用的简单的桌面静态 Web 服务器,基于 Node.js 开发.您可以同时在上面运行任意数量的项目,特别适合前端开发人员使用. 您可以通过免费的 Node.js 控制 ...
- JS实现HTML静态页传值的方法
JS实现HTML静态页传值的方法 作者:前端开发-武方博 发布:2012-10-29 分类:javascript 阅读:8,735次 此处使用JS方式实现静态页之间值传递,其实很简单,废话不多 ...
- node.js 如何处理一个很大的文件
node.js 如何处理一个很大的文件 思路 arraybuffer 数据分段 时间分片 多线程 web workers sevice workers node.js 如何处理一个很大的文件 http ...
- 2.Node.js access_token的获取、存储及更新
文章目录: 1.Node.js 接入微信公众平台开发 2.Node.js access_token的获取.存储及更新 一.写在前面的话 上一篇文章中,我们使用 No ...
- 使用java的 htpUrlConnection post请求 下载pdf文件,然后输出到页面进行预览和下载
使用java的 htpUrlConnection post请求 下载pdf文件,然后输出到页面进行预览和下载 2018年06月07日 10:42:26 守望dfdfdf 阅读数:235 标签: jav ...
- requireJS中如何用r.js对js进行合并和压缩css文件
我运行的环境是windows+node.js,首先是用npm安装requirejs(全局安装,即使用 'npm install requirejs -g',这样方便在各个目录调用),接着就是下载r.j ...
- 用node.js搭建一个静态资源站 html,js,css正确加载 跳转也完美实现!
昨天买了一个服务器想着用来测试一些自己的项目,由于是第一次建站,在tomcat,linux,node.js间想了好久.最终因为node搭建比较方便没那么麻烦就决定用node.js来搭建网站项目. 搭建 ...
- 如何在Node.js中合并两个复杂对象
通常情况下,在Node.js中我们可以通过underscore的extend或者lodash的merge来合并两个对象,但是对于像下面这种复杂的对象,要如何来应对呢? 例如我有以下两个object: ...
随机推荐
- dijit.byId("grid") is undefined
1.错误描述 TypeError:dijit.byId(...) is undefined (68 out of range 3) 2.错误原因 var gridName = dijit ...
- Filter的注册2
既然Filter是一种COM组件,使用前就必须先注册.Filter的注册程序为regsvr32.exe (位于操作系统目录的system32子目录下).假设现在有一个Filter文件,它的完整路径为C ...
- oracle 常用知识积累
一. 基本操作 1. 表操作 1.1 复制建表 create table test as select * from dept; --从已知表复制数据和结构 create table test a ...
- 美团CodeM复赛 02,03
02 城市网络 比赛时候写的是单调栈,真的是让人见笑了,基本思路就是dfs时候动态处理单调栈(带回溯),然后离线处理答案.题解是用了倍增的,效率高很多 #include <cstdio> ...
- iOS - Quartz 2D 贝塞尔曲线
1.贝塞尔曲线 贝塞尔曲线(Bézier curve),又称贝兹曲线或贝济埃曲线,是应用于二维图形应用程序的数学曲线.一般的矢量图形软件通过它来精确画出曲线,贝兹曲线由线段与节点组成,节点是可拖动的支 ...
- monkeyrunner_控件坐标获取
1.Pointer location获取坐标 通过模拟器中的设置-开发者选项,找到"指针位置"的选项,勾选上.如下图所示. 勾选后,模拟器的最顶部则显示坐标,比如点击模拟器上的任一 ...
- SpringMVC 框架系列之初识与入门实例
微信公众号:compassblog 欢迎关注.转发,互相学习,共同进步! 有任何问题,请后台留言联系! 1.SpringMVC 概述 (1). MVC:Model-View-Control Contr ...
- 移动端的silder,未封装,基于zepto的touch模块,有参照修改过touch的bug
<!--html模块--> <header class="appoin-head"> <ul> <li class="aa&qu ...
- POJ 2195 Going Home (费用流)
题面 On a grid map there are n little men and n houses. In each unit time, every little man can move o ...
- 关于C++ const 的全面总结《转》
C++中的const关键字的用法非常灵活,而使用const将大大改善程序的健壮性,本人根据各方面查到的资料进行总结如下,期望对朋友们有所帮助. Const 是C++中常用的类型修饰符,常类型是指使用类 ...