前言
在前端开发中，需要搭建本地服务器进行调试和开发。以前常用的是 http-server、live-server 等 npm 包，不过我最近了解到一个好用的 npm 包 c-server，它支持实时编译 TypeScript、React 和 Sass，还可以自定义路由及中间件。本篇文章将详细介绍如何使用 c-server。
安装及使用
使用 npm 全局安装 c-server
npm install -g c-server
安装完成后，我们可以在终端输入 c-server 命令来启动服务器。默认情况下，c-server 会在当前目录下启动服务器，并监听 8080 端口。可以通过以下命令更改监听端口：
c-server -p 3000
在浏览器中，打开 http://localhost:3000 即可看到服务器已启动。
自定义路由和中间件
通过以下命令来创建一个名为 app.js 的 JavaScript 文件并运行
touch app.js && c-server app.js
接下来我们修改 app.js 文件：
-- -------------------- ---- ------- ----- --- - --------------- ----- ------ - ----------------------- ----- --- - --- ------ ----- ------ - --- --------- --------------- ----- ----- -- - -------- - ------ -------- --- -- ----- ------------- ----- ----- -- - ----------------------- ----- ------- ----------------------- --- ------------------------- -----------------
打开 http://localhost:3000/，可以看到页面输出 Hello World!，我们还通过中间件打印了日志。
实时编译 TypeScript、React 和 Sass
c-server 默认支持实时编译 TypeScript、React 和 Sass，具体使用方法如下：
- 将 TypeScript、React 或 Sass 代码写入
.tsx、.ts或.scss文件中 - 启动 c-server 并将文件扩展名指定为对应的类型，比如
# 开启 ts 实时编译模式 c-server app.tsx --ts # 开启 sass 实时编译模式 c-server style.scss --sass
注意：开启实时编译模式会导致服务器性能下降，不建议生产环境下使用。
小结
c-server 是一个极其便捷的 npm 包，支持实时编译 TypeScript、React 和 Sass，并且可以自定义路由及中间件。相比于其他本地服务器 npm 包，c-server 的功能更加全面，能够在前端开发中带来很多便利。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60066c8fccdc64669dde57d6