JavaScript的构建工具、自动化系统和任务运行器

前言:

把本地开发的项目目录转换为线上应用程序需要一系列步骤。每个步骤都需要细分为很多子任务,
如构建和部署应用程序要涉及模块打包、编译、压缩和发布静态资源,等等。运行单元和集成测试也涉
及初始化测试套件和控制无头浏览器。为了让管理和使用这些任务更容易,也出现了很多工具可以用来
更高效地组织和拼接这些任务。

1.1 Grunt

Grunt 是在 Node.js 环境下运行的任务运行器,使用配置对象声明如何执行任务。Grunt 有庞大的社
区和众多插件可以支持项目构建。

1.2 Gulp

与 Grunt 类似,Gulp 也是在 Node.js 环境下运行的任务运行器。Gulp 使用 UNIX 风格的管道方式定
义任务,每个任务表现为一个 JavaScript 函数。Gulp 也有活跃的社区和丰富的扩展。

1.3 Brunch

Brunch 也是 Node.js 构建工具,旨在简化配置,方便使用。Brunch 虽然比 Gulp 和 Grunt 出现得晚,
但仍有很多插件可以选择

1.4 npm

npm 严格来讲不是构建工具,但它提供了脚本功能,很多项目会利用这个功能融合任务运行器。脚
本是在 package.json 中定义的

二、 代码检查和格式化

JavaScript 代码调试有一个问题,没有多少 IDE 可以在输入代码时提示代码错误。大多数开发者是
写一段代码,然后在浏览器里刷新看看有没有错误。在部署之前验证 JavaScript 代码可以显著减少线上
错误。代码检查器(linter)可以检查基本的语法并提供关于风格的警告。
格式化器(formatter)是一种工具,可以分析语法规则并实现自动缩进、加空格和对齐代码等操作,
也可以自定义完成对文件内容的其他操作。格式化器不会破坏或修改代码或者代码的语义,因为它们可
以避免做出影响代码执行的修改。

2.1 ESLint

ESLint 是开源的 JavaScript 代码检查器,由本书前几版的作者 Nicholas Zakas 独立开发;完全“可
插拔”,以常识化规则作为默认规则,支持配置;有大型可修改和可切换的规则库,可以用来调试工具
的行为。

2.2 Google Closure Compiler

Google Closure Compiler 内置了一个代码检查工具,可以通过命令行参数激活。这个代码检查器基
于代码的抽象语法树工作,因此不会检查空格、缩进或其他不影响代码执行代码组织问题。

2.3 JSLint

JSLint 是 Douglas Crockford 开发的 JavaScript 验证器。JSLint 从核心层面检查语法错误,以最大限
度保证跨浏览器兼容作为最低要求。(JSLint 遵循最严格的规则以确保代码最大的兼容性。)可以启动
Crockford 关于代码风格的警告,包括代码格式、使用未声明的变量,等等。JSLint 虽然是使用 JavaScript写的,但可以通过基于 Java 的 Rhino 解释器在命令行执行,也可以通过 WScript 或其他 JavaScript 解释器执行。它的网站提供了针对每个命令行解释器的自定义版。

2.4 JSHint

JSHint 是 JSLint 的分支,支持对检查规则更宽泛的自定义。与 JSLint 类似,JSHint 也先检查语法错
误,然后再检查有问题的代码模式。JSLint 的每项检查 JSHint 中也都有,但开发者可以更好地控制应用
哪些规则。同样与 JSLint 类似,JSHint 可以使用 Rhino 在命令行中执行。

2.5 ClangFormat

ClangFormat 是构建在 Clang 项目的 LibFormat 库基础上的格式化工具。它使用了 Clang 格式化规则
自动重新组织代码(不会改变语义结构)。ClangFormat 可以在命令行中使用,也可以集成到编辑器里。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

张清悠

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值