简介
grunt-urequire 是一个基于 grunt 的前端构建工具，可以帮助开发人员在项目中使用 CommonJS 或 AMD 模块化规范。它可以将模块化代码打包成一个或多个文件，并且支持自定义的处理逻辑。
安装
使用 npm 安装 grunt-urequire：
npm install grunt-urequire --save-dev
配置
在 Gruntfile.js 中配置 grunt-urequire:
-- -------------------- ---- ------- -------------- - --------------- - ------------------ --------- - -------- - ------- ------- -------- ----- ------------------ ----- ---------- ---- -- ---------- - ---- ---------------- ----- ------------- - - --- ------------------------------------- --展开代码
其中，options 属性用于设置 grunt-urequire 的选项，比如指定输出目录、是否打包 Node.js 模块、是否暴露所有模块等。my_target 属性用于指定要处理的文件源和输出目标。
示例
打包单个文件
假设我们有如下目录结构：
project/ ├── Gruntfile.js ├── package.json ├── src/ │ ├── module1.js │ └── module2.js └── index.html
其中，module1.js 和 module2.js 都是 CommonJS 或 AMD 格式的模块。
我们可以使用 grunt-urequire 将它们打包成一个文件：
-- -------------------- ---- ------- -------------- - --------------- - ------------------ --------- - -------- - ------- ------- -------- ----- ------------------ ----- ---------- ---- -- ---------- - ---- ------------------ ------------------ ----- ------------- - - --- ------------------------------------- ----------------------------- -------------- --展开代码
然后运行 grunt 命令即可得到输出结果：dist/app.js。
打包多个文件
如果我们有更多的模块需要打包，可以采用通配符的方式指定源文件路径。例如，将 src 目录下所有 JavaScript 文件打包：
-- -------------------- ---- ------- -------------- - --------------- - ------------------ --------- - -------- - ------- ------- -------- ----- ------------------ ----- ---------- ---- -- ---------- - ---- ---------------- ----- ------------- - - --- ------------------------------------- ----------------------------- -------------- --展开代码
自定义处理逻辑
有时我们需要对某些模块做额外的处理，比如压缩、混淆等。grunt-urequire 支持通过自定义插件来实现这些操作。
例如，我们想要对 app.js 进行压缩，可以添加以下配置：
-- -------------------- ---- ------- -------------- - --------------- - ------------------ --------- - -------- - ------- ------- -------- ----- ------------------ ----- ---------- ----- -------- ------------ -- ---------- - ---- ---------------- ----- ------------- - - --- ------------------------------------- ----------------------------- -------------- --展开代码
这里使用了 uglifyjs 插件进行压缩。安装插件：
npm install grunt-urequire-uglifyjs --save-dev
然后在 Gruntfile.js 中注册插件：
-- -------------------- ---- ------- -------------- - --------------- - ------------------ --------- - -------- - ------- ------- -------- ----- ------------------ ----- ---------- ----- -------- ------------ - ----------------------------------------------------------- -------- ----------------------------------------------------------------------------------展开代码
