什么是 ehdev-server
ehdev-server 是一个前端开发用的本地服务器工具，它能够快速创建一个本地开发环境，并支持 webpack、babel、postcss 等插件，可以满足大多数前端项目的本地开发需求。
如何使用 ehdev-server
安装
首先需要在全局安装 ehdev-server：
npm install -g ehdev-server
安装成功后，可以在终端输入ehdev-server命令验证是否安装成功。
配置
ehdev-server 的配置非常灵活，可以通过配置文件（.ehdevrc 文件）进行配置，也可以通过命令行参数配置。
配置文件
在项目根目录下创建 .ehdevrc 文件，可以配置如下选项：
-- -------------------- ---- -------
-
------- ----------
------- -----
------- -----
---------- -
------------------------------ ---
--
-------------- -
-----------------------
--------------------
--
---------------- -
-------- -----------------
--------- -
----------- ------------
------- --------
-
-
-命令行参数
也可以通过命令行参数进行配置：
ehdev-server --host 0.0.0.0 --port 8080 --open --headers Access-Control-Allow-Origin=*
运行
在项目根目录下运行ehdev-server命令即可启动本地服务器，浏览器会自动打开本地服务器地址。如果没能自动打开浏览器，可以手动输入服务器地址进行访问。
ehdev-server 实战案例
下面是一个使用 ehdev-server 的实战案例，该例子使用了 webpack 和 babel 插件，并利用 ehdev-server 进行本地开发调试。
安装依赖
安装 ehdev-plugin-webpack 和 ehdev-plugin-babel 两个插件：
npm install --save-dev ehdev-plugin-webpack ehdev-plugin-babel
配置 .ehdevrc 文件
在项目根目录下创建 .ehdevrc 文件，进行如下配置：
-- -------------------- ---- -------
-
------- ----------
------- -----
------- -----
---------- -
------------------------------ ---
--
-------------- -
-----------------------
--------------------
--
---------------- -
-------- -----------------
--------- -
----------- ------------
------- --------
-
-
-编写代码
在 src 目录下，创建一个 index.js 文件，输入如下代码：
const div = document.createElement('div');
div.innerHTML = 'Hello, ehdev-server!';
document.body.appendChild(div);运行
在终端输入ehdev-server命令启动本地服务器，浏览器自动打开，即可看到浏览器中显示出Hello, ehdev-server!。
结语
ehdev-server 是一个非常实用的本地服务器工具，它能够快速创建本地开发环境，并支持 webpack、babel、postcss 等插件，可以满足大多数前端项目的本地开发需求。在实践过程中，可以灵活地配置 ehdev-server，使其更符合自己的项目需求，提高开发效率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055cb381e8991b448da1b8