前言
aster-runner 是一个基于 gulp 的前端工程化工具。它可以将前端项目打包成静态文件，方便部署和维护。本文将详细介绍如何使用 aster-runner。
安装
首先，您需要安装 node.js 和 npm。安装完成后，在命令行工具中执行以下命令即可全局安装 aster-runner。
npm install -g aster-runner
使用
在前端项目的根目录中，新建一个 gulpfile.js 文件，内容如下：
-- -------------------- ---- ------- ----- ------ - ------------------------ ----- ------ - --- --------- -------------------- -- -- - --------------------- --- --------------------
通过 require('aster-runner') 引入 aster-runner，然后创建一个 Runner 实例。在 Runner 实例中，定义一个名为 build 的任务，然后调用 run 方法，即可执行该任务。如果一切正常，输出的内容应该是“构建任务！”。
配置
通过配置，可以灵活地定制 aster-runner 的行为。在 gulpfile.js 文件中，可以定义下列参数。
src
表示项目源代码所在的目录。默认值为 'src'。
const Runner = require('aster-runner');
const runner = new Runner({
src: 'client/src'
});
//...dest
表示 build 后的目录。默认值为 'dist'。
const Runner = require('aster-runner');
const runner = new Runner({
dest: 'client/dist'
});
//...clean
表示 build 前是否先清空目标目录。默认值为 true。
const Runner = require('aster-runner');
const runner = new Runner({
clean: false
});
//...tasks
表示定义的 gulp 任务。默认值为 {}。
-- -------------------- ---- -------
----- ------ - ------------------------
----- ------ - --- --------
------ -
---------- --------- ---------
-------- --------- ------- ------ ------
-------- ----------
-
---
-----示例
为了更好地说明 aster-runner 的使用方法，这里给出一个完整的示例，该示例演示了如何使用 aster-runner 打包一个简单的静态网站。
假设我们的网站结构如下：
-- -------------------- ---- ------- ----- --- --- - --- --- - - --- --------- - --- ---- - - --- ---------- - --- -- - --- ------ --- -----------
我们的目标是将 src 目录中的源文件打包成 dist 目录中的静态文件。我们的操作如下：
- 安装 aster-runner。
npm install -g aster-runner
- 在 site 目录中新建 gulpfile.js 文件，内容如下所示。
-- -------------------- ---- -------
----- ------ - ------------------------
----- ------ - --- --------
---- ------
----- -------
------ -----
------ -
---------- --------- ---------
-------- -------- ------ -----
-
---
------------------- -- -- -
------ ------
-----------------
---------------------
---
------------------ -- -- -
------ ------
----------------
---------------------
---
----------------- -- -- -
------ ------
---------------
---------------------
---
--------------------- -- -- -
---------------------- -----------
---
----------------------------通过 Runner 实例的构造函数，我们传入了 src 和 dest 的值，并定义了 gulp 任务。在定义的任务中，我们使用了 src 和 dest 方法读写文件。
- 打包。
执行以下命令即可将项目打包。
gulp build
如果一切正常，dist 目录中应该包含了构建好的静态文件。
- 监听文件变化。
执行以下命令即可监听源代码的变化。
gulp
如果一切正常，修改源代码后，build 任务会自动重新执行，以构建最新的静态文件。
结束语
aster-runner 是一个优秀的前端工程化工具，它可以将前端项目打包成静态文件，方便部署和维护。本文介绍了 aster-runner 的安装、使用和配置方法，以及给出了一个完整的示例。如果您正在寻找一个前端构建工具，不妨试试 aster-runner。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/75031