前言
npm（node package manager）是专门用于 Node.js 平台的包管理工具，开发者可以通过 npm 安装，共享和分发 Node.js 模块。而 whaler 是 npm的一个包，它可以帮助我们更好地管理和使用我们的npm包。本文将介绍如何使用 whaler，包括安装、配置和实际使用。
安装
在开始使用 whaler 之前，我们需要先安装 node 和 npm。如果你还没有安装，可以去官网下载，并进行安装。然后，我们就可以通过 npm 来安装 whaler 了。
npm install -g whaler
安装完成后，我们可以通过 whaler --help 命令查看 whaler 的所有命令及说明。
使用
初始化项目
使用 whaler 可以方便的初始化一个项目。在需要初始化项目的文件夹内，运行下面命令即可。
whaler init这个命令将会初始化一个已配置好的项目目录，如下所示。
my-project/ ├── src/ │ ├── index.css │ └── index.js ├── .whaler/ │ ├── config.yaml │ └── whaler.yaml └── package.json
其中， src/index.css 和 src/index.js 分别是项目的入口样式和逻辑。 .whaler/ 文件夹是 whaler 专用文件夹，包含该项目的默认配置文件和 whaler 配置文件。
配置文件
whaler 配置文件的格式是 yaml，包含各种模板和依赖包的配置信息。以 config.yaml 文件为例，示例如下。
-- -------------------- ---- ------- - --------------- ----- ------- --------------- ----- --------------- ---- ---- ---- --------- ----- ---- --------------- -- --- ---- - --------- ------- ---- ----- ----- --- ---- -------- ----- ---- ----- ---- ---------- ----- ---- ---------------- ------------------- ---- -------------------- ----展开代码
其中， scss 配置项设置将 sass 文件编译成 css 文件，并针对不同的 sass 文件进行不同的编译参数配置。 css 和 js 配置项分别设置了源代码目录和目标代码目录，并且通过 autoprefixer 包来完成 css 的自动重构；通过 html-minifier 包来压缩 html 文件。
whaler 命令
使用 whaler 可以方便的进行代码编译，调试和构建，包含以下命令。
whaler serve：启动本地调试服务；whaler build：编译代码并构建项目；whaler lint：检查代码的规范性；whaler clean：清空输出目录。
示例
在我们的项目路径下，已经有了一个默认的 index.js 和 index.css。现在，我们通过 whaler 配置和命令对它们进行操作。
编辑 index.css
我们将 src/index.css 文件改成以下内容。
body { background-color: #f9f9f9; }
配置文件修改
将 config.yaml 文件中的 scss 修改成以下内容。
scss: $=sass: indentedSyntax: true sourceComments: true css: src: src/*.scss dest: dist $=autoprefixer: '> 1%, last 2 versions, Firefox ESR, Opera 12.1'
编译代码
运行如下命令，编译代码。
whaler这条命令等价于 whaler build 命令，用来生成一个可用于生产的代码包。
本地调试
运行如下命令，启动本地调试服务。
whaler serve然后在浏览器中打开 http://localhost:8080/，即可看到我们修改后的背景颜色。
结语
本文对 whaler 的使用做了详细介绍，包括安装、配置和实际应用过程，希望对开发者的工作有所帮助。当然， whaler 的功能远不止这些，我们可以根据自己的需求来进行个性化配置和优化。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/97302
