javascript - 为什么我的 grunt-contrib-requirejs 没有优化任何东西?

标签 javascript gruntjs requirejs grunt-contrib-requirejs

我正在尝试启动并运行 grunt-contrib-requirejs任务。
作为 RequireJS 的新手,并且从未使用过优化器/r.js,我真的很困惑如何让它工作。

首先,我设置了一个简单的目录结构,如下所示:

root
├── js
│   ├── helper
│   │   ├── a.js
│   │   ├── b.js
│   │   └── d-dep.js
│   └── main.js
├── node_modules
│   └── [dependencies from package.json]
├── Gruntfile.js
└── package.json

我已经在浏览器中对其进行了测试,并且所有依赖项均已正确加载。

我的 Grunt 文件:

module.exports = function(grunt) {
  grunt.config.init({
    requirejs: {
      options: {
        baseUrl: 'js/',
        mainConfigFile: 'js/main.js',
        dir: 'target/',
        keepBuildDir: true
      }
    }
  });

  require('load-grunt-tasks')(grunt);
}

main.js:

require(["helper/a", "helper/b"], function(util) {
  console.log('main.js loaded');
});

a.js

console.log('a.js loaded');

b.js

define(['js/helper/b-dep.js'], function(bdep) {
  console.log('b.js loaded');
});

b-dep.js

console.log('b.js dependency loaded');

运行grunt requirejs时,我收到一条完成,没有错误。消息,但看不到任何优化文件 - 我猜测错误出现在 Gruntfile 中,可能带有路径。

有没有看到什么让你印象深刻的事情?为什么没有任何优化,尽管它说完成,没有错误。

最佳答案

您似乎没有告诉它优化某些东西。您应该设置一个 name 选项来告诉它主模块是什么。此外,您传递给 grunt 的配置中缺少一级配置。 options 对象必须位于更具体的目标内,例如 compile:

requirejs: {
  compile: { // <<== nest the options in this.
    options: {
      baseUrl: 'js/',
      mainConfigFile: 'js/main.js',
      name : 'main', // <<=== add this
      dir: 'target/',
      keepBuildDir: true
    }
  }
}

设置mainConfigFile是不够的,因为这只告诉优化器应该从哪里获取运行时配置。它不会告诉优化器该文件是一个模块。请注意,name 中缺少 .js 扩展名并不是错误。您应该避免在模块名称中使用扩展名,除非有特定原因需要扩展名。 name 是相对于 baseUrl 的,所以这就是为什么它是 'main' 而不是 'js/main'

关于javascript - 为什么我的 grunt-contrib-requirejs 没有优化任何东西?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28120311/

相关文章:

javascript - 带有自定义图 block 的传单自定义 map

javascript - 为什么我的 Javascript 可以正常运行,但缩小后就不行了?

javascript - 如何向 requirejs r.js 优化器添加仅在构建期间运行的插件?

javascript - 配置 Karma 以使用 requirejs 加载 pegjs

javascript - RequireJS:根据环境加载不同的文件

javascript - 如果字符串为空,如何隐藏元素或 div?

javascript - json_encode 返回“

php - grunt magento2 警告标志显示 magento 命令

angularjs - 集成karma-runner和cucumberjs

javascript - 通过 FireFox 在 html 中打印带有图表的表格