简介
在前端开发中，经常需要使用一些工具帮助我们完成各种各样的任务，而 hjs 就是这样一款非常实用的工具之一。hjs 是一个基于 webpack 的极简静态网站开发工具，通过它，我们可以轻松地搭建一个快速、可维护的静态网站。
安装
首先，我们需要使用 npm 安装 hjs：
npm install hjs使用
开启开发服务器
执行以下命令即可开启开发服务器：
npm start开启开发服务器后，我们就可以愉快地进行开发了，在我们修改文件的同时，会实时更新预览页面。
构建
执行以下命令，即可将我们的项目构建成生产环境所需要的静态文件：
npm run build构建完成后，我们将看到一个 dist 文件夹，这个文件夹中包含了我们构建出来的静态文件。
更多配置
通过修改项目的 package.json 文件中的 hjs 配置项，我们可以对 hjs 进行更多的配置。以下是一些常用的配置项：
port
指定开发服务器的端口号，默认为 3000。
{ "hjs": { "port": 3001 } }
staticPaths
指定需要额外打包的静态文件路径，比如一些不依赖 webpack 处理的文件。
{ "hjs": { "staticPaths": [ "public" ] } }
html
配置 html 模板，可以自动生成页面的 head 部分的 meta 标签等等。
-- -------------------- ---- ------- - ------ - ------- - ----------- --------------------------- -------- --- ----- -------------- --- ------- ---- - - -展开代码
示例代码
为了更好地理解 hjs 的使用方法，下面是一个示例代码：
-- -------------------- ---- ------- ---- -------- ----- --------- - ----------------------- -------------- - ----------- --- ------------- ---- --------- ----------------- ----- ----- - --------- --------------------------- ------ --- ----- ------------ --- ------- ---- - ---展开代码
我们可以通过这段代码生成 hjs 的配置，然后将其传递给 webpack 进行打包。当然，在实际开发中，我们一般是通过 package.json 文件来进行 hjs 的配置的。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/75604
