TsServer

A simple local development server.

Install

$ npm install ts-server --save-dev

Usage

import TsServer from "ts-server"
import path from "path"
import config from "./config"

var name = "my-component"
var $server = new TsServer()
$server.set({
    root: config.paths.root,
    open: `${config.dirs.components}/${name}/preview/`,
    livereload: {
        directory: `${config.dirs.components}/${name}`,
        filter: function (file) {
            var filepos = file.replace(`${config.dirs.components}/${name}`, "")
            var sep = path.sep
            if(filepos.indexOf(sep + "dist") === 0 || filepos.indexOf(sep + "preview") === 0) {
                return true
            }
            else {
                return false
            }
        },
    },
}).start()

1 instantiate

var $server = new TsServer()

2 set options

$server.set(options)

3 start server

$server.start()

APIs

set(options)

set options before everything. Options will be merged with default options. The result us a copy of default options, so if you set again, new options will be merged with default options, not last options.

default options:

{
    host: "localhost",
    port: 8978,
    root: ".",
    open: "/",
    livereload: {
        enable: true,
        port: 9572,
        directory: ".", // only files in this directory changes causing reload
        filter: function(file) {
            // based on "directory", files in directory will be filtered for listening, return "true" to be listened, return "false" to ignore
            if(file.match(/node_modules/)) {
                return false
            }
            else {
                return true
            }
        },
        callback: function(file, current, previous) {
            // when a listened file changes
        },
    },
    middleware: [], // middleware for node http app.use. livereload is a middleware in fact
    indexes: false, // whether to display file indexes when you visit a folder
    onStart: function(app) {
        // app is an instance of express
    },
    onOpen: function() {},
    onReload: function() {},
    onRestart: function() {},
    onStop: function() {},
}

However, you can set options by passing options to constructor:

var server = new TsServer(options)
server.start()

start()

start a server after set. If the server is running, you can not start it again.

stop()

stop the running server.

restart()

stop() and then start().

reload()

Call the livereload to reload.

$server.reload()

open()

Open your local browser to open a new page. It's just an alias and improvement of open module. Just open in browser, no other feature.

$server.open(uri)

Events

onStart

When the server begin to start. before express app listen action.

$server.set({
    onStart: function(app) {
        app.use(...)
    },
})

onOpen

When server is setup, and open a browser webpage, with url

$server.set({
    ...
    onOpen: function(url) {},
    ...
})

onReload

After reload page.

onStop

When a server is closing.

onRestart

After a server restarted.

Generator

This application is generated by Componer. If you want to modify the source code, do like this:

npm i -g gulp-cli bower componer
mkdir your-project && cd your-project
componer init -i

componer pull {{componout-name}} -u https://github.com/{{author-name}}/{{componout-name}}.git
componer install {{componout-name}}

After you modified source code in src directory, run:

componer build {{componout-name}}

To learn more about componer, read this.