verver

A simple node server which can parse velocity template.

Usage no npm install needed!

<script type="module">
  import verver from 'https://cdn.skypack.dev/verver';
</script>

README

Verver

一个基于browser-sync的简单前端开发服务器,实现了解析Velocity模版,模拟Ajax请求,转发请求,自动刷新页面,编译less以及压缩css/js等功能。

安装

npm install verver -g

目录结构

只能支持以下特定目录结构:

root
│
├── css
│   ├── index.css
│   ├── index.less
│   └── index.min.css
├── js
│   ├── index.js
│   ├── index.min.js
│   └── lib
│       └── jquery.js
├── mock                       // 放置mock数据
│   ├── ajax                   // 放置ajax请求的mock数据
│   │   └── getFeature.json.js
│   └── velocity
│       ├── commonmock
│       │   └── common.js      // 放置common的mock数据,编译时会被合并到页面对应的mock数据中
│       └── index.html.js      // 放置Velocity模版对应的mock数据
├── template                   // 放置Velocity模版
│   └── index.html
└── verver.js                  // verver配置文件

查看demo

npm install verver
cd verver
npm test
open http://localhost:3001/

使用

verver

命令行参数

  Usage: verver [options]

  Options:

    -h, --help         output usage information
    -V, --version      output the version number
    -p, --port <int>   server listen port
    -r, --root <path>  server root directory

配置文件

以下为内置默认配置,如想自定义配置,请添加verver.js,并放置于server根目录。

module.exports = {
    port: 3000,
    livereload: true,
    watchExtension: [ '.html', '.css', '.js' ],
    rewrite: null,
    jsonp: 'jsoncallback',
    serverOpts: null,
    less: {},
    cleanCSS: {},
    uglifyJS: {}
}

选项

选项 类型 默认值 说明
port number 3000 server监听的端口号
livereload boolean true 是否监听文件改动自动刷新页面
watchExtension array [ '.html', '.css', '.js' ] 监听文件改动自动刷新页面的文件后缀名,该选项只有在livereload设置为true时才会起作用
rewrite object null 转发url的对象,key值为转发的url,value为实际的url
jsonp string "jsoncallback" 模拟跨域访问ajax请求的回调函数名
serverOpts object null browser-sync server属性的配置
less object/boolean {} 是否编译less,设置为false不编译,设置为对象则编译,会在文件当前目录下生成同名的css文件,参数对应less模块调用render方法传递的option
cleanCSS object/boolean {} 是否压缩css,设置为false不压缩,设置为对象则压缩,会在文件当前目录下生成同名的min.css文件,参数对应clean-css模块创建CleanCSS对象传递的option
uglifyJS object/boolean {} 是否压缩js,设置为false不压缩,设置为对象则压缩,会在文件当前目录下生成同名的min.js文件,参数对应UglifyJS2模块调用minify方法传递的option