local-dev-server
v1.0.35
Published
a local dev server with simple api proxy.easy and fast.
Downloads
156
Maintainers
Readme
local-dev-server
a local dev server with simple api proxy.
a esbuild dev server implements.
local-dev-server use EventSource to notify client to reload.
https://developer.mozilla.org/en-US/docs/Web/API/EventSource
install
npm i local-dev-server -D
usage
import { dev } from "local-dev-server";
//dev function return a reload callback ,
//you can use reload function to reload current dev pages
const { reload } = dev({
port: 9000,
});
//watch on change
setInterval(() => {
reload("test....");
}, 10000);
default options
const options = {
server: "localhost",
root: "./",
port: 8900,
//use fixPath to handle req path
fixPath: (req) => {
const [reqPath] = req.url.split("?");
const accept = req.headers.accept ?? "";
let fileName = "";
let extName = "";
if (!path.extname(reqPath)) {
if (reqPath.endsWith("/")) {
fileName = "index";
}
if (accept.includes("text/html")) {
extName = ".html";
} else if (accept == "*/*") {
extName = ".js";
}
}
return { fileName, extName };
},
};
const apiOptions = {
host: "localhost",
port: 8080,
from: "/api",
to: "/api",
//use dispatch to handle multi server apis
dispatch(url) {
if (url.startsWith("/abc")) {
return {
from: "/abc",
to: "/def",
//support url proxy header
headers: (req) => {
return {
"From-Url": req.url,
};
},
};
} else if (url.startsWith("/aaa")) {
return {
from: "/abc",
to: "/def",
host: "local",
port: 9999,
};
}
return false;
},
};
dev(options, apiOptions);
working with esbuild
import { dev } from "local-dev-server";
let buildResult=null
const { reload } = dev({
port: 9000,
https:false,//https:{key:key,cert:cert}
response: (filePath, res) => {
//if use esbuild ,and write:false
//find the contents of esbuild
const outfile = buildResult?.outputFiles.find(
(file) => file.path == filePath
);
if (outfile) {
res.setHeader("Content-Type", "application/javascript;charset=utf-8");
res.end(outfile.contents);
return true;
}
return false;
},
});
//some code
//.....
esbuild.build({
...options,
entryPoints: [infile],
outfile,
write:false
watch:
{
onRebuild(error, result) {
if (error) console.error('watch build failed:', error)
else {
console.log('watch build succeeded:', result)
//when esbuild rebuild,call reload function
buildResult=result
reload("esbuild rebuild ok,reload now!")
}
},
}
}).then(result => {
console.log(`build ${module} ok!`)
buildResult=result
})
new esbuild version had remove onRebuild event
use a plugin to get build result
const ctx = await esbuild.context({
...options,
write: false,
outfile,
plugins: [
{
name: "watch-plugin",
setup(build) {
build.onStart(() => {
console.log(
"starting build.............................................."
);
});
build.onEnd((result) => {
if (result.errors.length == 0) {
buildResult = result;
reload("[app rebuild ok]");
} else {
console.log("build error", result.errors);
}
});
},
},
],
});
await ctx.watch();
console.log("watching.........................................");
open browser support
//openBrowser :defualt,chrome,firefox,edge
//openBrowser set true,will open chrome
const { reload } = dev({ root: "./test/", openBrowser: "edge" });