在前端开发中，我们通常需要处理大量的文件。而为了提高效率，我们往往只希望针对修改过的文件进行编译、压缩等操作，以节省时间和资源。本文将介绍如何在 grunt.js 中实现这个目标。
问题分析
首先，我们需要明确一下问题的来源：grunt.js 是一个基于任务（task）的构建工具，它能够自动化执行各种前端工作流程。但是默认情况下，grunt.js 每次都会遍历整个项目目录，并执行指定的任务。这意味着即使只有一小部分文件发生了变化，也需要重新编译所有的文件，这无疑会浪费大量的时间和计算资源。
为了解决这个问题，我们需要找到一种方法，让 grunt.js 只运行那些被修改过的文件，并跳过未更改的文件。这样就可以大大缩短任务执行时间，并提高开发效率。
解决方案
在 grunt.js 中，可以通过两种方式来实现仅运行更改的文件：
1. 使用 watch 任务
watch 任务是 grunt.js 提供的一种监控文件变化的方式。它可以监听指定文件或文件夹中的文件变化，并在文件发生变化时自动执行指定的任务。
通过配置 watch 任务，我们可以指定需要监控的文件或文件夹，并针对每个文件设置一个单独的任务。这样，在文件发生变化时，只有与该文件相关的任务会被执行，而其他任务则会被跳过。
-- -------------------- ---- -------
------ -
---- -
------ ------------------
------ ----------
--
--- -
------ ----------------
------ ----------
-
-在上面的代码中，我们通过 watch 任务来监听 src/css 和 src/js 文件夹中的 CSS 和 JS 文件的变化，并分别执行 cssmin 和 uglify 任务。这样，每次只有修改了 CSS 或 JS 文件时，相应的任务才会被执行。
2. 使用 grunt-newer 插件
grunt-newer 是一个第三方插件，它可以帮助我们判断哪些文件已经被修改过，并仅运行修改过的文件所关联的任务。
使用 grunt-newer 插件非常简单，只需要在定义任务时调用它即可：
-- -------------------- ---- -------
------------------
------- -
-------- -
---------- ----
--
------ --
------- -----
---- ----------
---- --------- --------------
----- -----------
---- ----------
--
--
------ -
-------- -
---------- ----
--
------ --
------- -----
---- ---------
---- -------- -------------
----- ----------
---- ---------
--
-
---
-------------------------------------------
-------------------------------------------
----------------------------------
----------------------------- ---------------- -----------------在上面的代码中，我们定义了两个任务 cssmin 和 jsmin，并使用 grunt-newer 插件来确保仅运行那些被修改过的文件所关联的任务。最后，我们将这两个任务注册为默认任务，并通过 grunt 命令来执行它们。
总结
在本文中，我们介绍了如何在 grunt.js 中仅运行更改的文件，以提高开发效率。具体来说，我们提出了两种解决方案：使用 watch 任务和使用 grunt-newer 插件。无论选择哪种方式，都
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/24288