简介
@sage-cli/plugin-preset 是 Sage CLI 的预设插件，它为前端项目提供了许多预设的配置和工具，使得我们可以专注于业务代码的开发。
该 npm 包包含了一些脚本命令用于项目的构建、测试、部署等等。接下来，将详细介绍该 npm 包的使用方法。
安装
使用 npm 安装 @sage-cli/plugin-preset：
npm install --save-dev @sage-cli/plugin-preset
使用
在 package.json 中配置
在 package.json 中添加以下配置：
-- -------------------- ---- ------- - ------- --------- ---------- -------- ---------- - -------- ----------------- ------- -------- ----------------- ------- ------- ----------------- ------ ------- ----------------- ----- -- ------- - ---------------- - -------------------------- - ----------------- ----- ------------- ---- - - - -展开代码
以上配置中，sage 属性下的 pluginOptions 指定了 @sage-cli/plugin-preset 的配置项，详细配置请参阅 @sage-cli/plugin-preset 官方文档。
使用预设命令
在 package.json 中的 scripts 属性中，我们已经添加了 start、build、test、lint 四个命令。这一部分，将会分别介绍它们的使用方法。
start
启动开发服务器，监听文件变化，实时刷新页面。使用以下命令启动项目：
npm run startbuild
打包项目，生成静态文件。使用以下命令构建项目：
npm run buildtest
运行测试用例。使用以下命令运行测试用例：
npm run testlint
检测代码是否符合规范。使用以下命令进行代码检测：
npm run lint自定义命令
除了使用预设命令，我们还可以自定义命令。在 package.json 的 scripts 属性中添加命令即可。
例如，我们可以添加一个新的命令 deploy，用于将构建好的项目文件上传至服务器：
-- -------------------- ---- ------- - ------- --------- ---------- -------- ---------- - -------- ----------------- ------- -------- ----------------- ------- ------- ----------------- ------ ------- ----------------- ------ --------- ----------------- ------- -- ------- - ---------------- - -------------------------- - ----------------- ----- ------------- ---- - - - -展开代码
在使用 npm run deploy 命令时，将会调用 @sage-cli/plugin-preset 的 deploy 命令。
使用插件
@egret/sage-cli-plugin 将会提供其他一些相关的插件，您可以在项目中安装并使用：
npm install --save-dev @egret/sage-cli-plugin-stylus
然后，将插件添加到配置中：
-- -------------------- ---- ------- - ------- --------- ---------- -------- ---------- - -------- ----------------- ------- -------- ----------------- ------- ------- ----------------- ------ ------- ----------------- ----- -- ------- - ---------------- - -------------------------- - ----------------- ----- ------------- ---- -- -------------------------------- - ------ ---------------------------- - - - -展开代码
结语
除了以上介绍的内容，@sage-cli/plugin-preset 还包括了很多其他的功能和选项，值得开发者们去深入研究。通过规范化的构建流程，可以提高项目的开发效率，减少出错风险。其次，减少了对框架细节的关注，可以更加专注于业务代码的开发。
希望这篇文章能够对前端开发者们有所帮助，使其更加熟练的使用 Sage CLI。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006735a890c4f7277583f04
