简介
@erect/server 是一种快速搭建前端开发服务器的 npm 包，可以通过简单的配置快速搭建一个本地开发服务器，支持自动刷新、HMR 等功能，适用于前端开发、模板制作、静态页面展示等场景。
安装
可以通过 npm 或 yarn 安装：
--- ------- ---------- ------------- - - ---- --- ----- -------------
使用
下面是一个简单的示例，来实现一个供本地开发使用的服务器：
----- ----------- - -------------------------
----- ------ - -
----- -----
----- ----------
----- -----
---------------- ---------
------ -
------- -
------- ------------------------
------------- ----
-
-
--
--------------------上面的代码中，我们首先引入了 @erect/server，然后配置了一些参数，最后调用 erectServer(config) 开启了一个本地服务器。
port: 服务器监听的端口号，默认 8080。host: 服务器监听的地址，默认 127.0.0.1。open: 是否在启动服务器后自动打开浏览器，默认为false。staticDirectory: 静态文件（例如 HTML、CSS、JS 等）所在的目录，默认为public。proxy: 需要反向代理的 API，可以配置多个。例如上面的配置表示，所有以/api开头的请求将会转发到http://localhost:8080地址，注意需要配置changeOrigin接口防止跨域问题。
npm scripts
日常开发中，我们通常会将一些常用的命令写入 package.json 文件的 scripts 字段中，然后通过 npm run 来运行。因此，我们也可以在 scripts 中配置一些命令，实现启动服务器、构建打包等操作。
例如以下示例，我们可以在 scripts 中添加如下代码：
-
---------- -
-------- ------ -------
-------- ------ ------
-
-这样，就可以通过以下命令来启动服务器或构建打包：
- ----- --- ----- - ---- --- --- -----
注意，当我们只使用 npm start 或 npm run 时，会在当前目录下查找是否存在 node_modules/.bin 目录，并在其中查找命令是否存在。因此在以上示例中，命令 erect 将会被解析为 node_modules/.bin/erect。
高级配置
当然，@erect/server 还支持更多高级的配置，可以通过 plugin 字段来扩展各种功能。
例如，如果需要开启 Sass 或 Less 文件的编译，可以配置 plugin: ["css"] 或 plugin: ["less"]，在服务器启动时会自动对指定的文件进行编译。
----- ----------- - -------------------------
----- ------ - -
----- -----
----- ----------
----- -----
---------------- ---------
------ -
------- -
------- ------------------------
------------- ----
-
--
------- --------
--
--------------------更多高级配置，可以参考官方文档。
总结
@erect/server 是一款十分实用的前端开发服务器，尤其适用于开发、模板制作、静态页面展示等场景。通过简单的配置，就可以快速搭建起一个本地开发服务器。相信读者们在实际开发中使用 @erect/server 时能够有所收获，提高自己的开发效率。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/142586