结合使用JSLint/Hint和requirejs

Question

我目前正在为一个require.js驱动的项目设置一个自动化的构建脚本(使用gruntjs)。因此，在使用r.js连接和缩小它之前，我想在所有需要的文件上运行jslint/jshint。由于js文件夹包含许多我不想修改的开发文件，所以我不能简单地将js/**/*.js传递给JSLint。我的第一个想法是使用optimizer: 'none'运行r.js，对连接的文件进行lint，然后缩小它，但由于两个原因，这不是一种选择。因此，我正在寻找一种可能，将linting连接到r.js优化器进程中，或者至少以某种方式获得所需依赖树的列表，以便我可以解析它并将其传递给lint。或者任何适用于自动化过程的解决方案，您都可以提出。

Answer 1

这个答案有点绕过了Grunt，但它应该适用于您想要做的事情。我这样做的方式是查看r.js，并尝试覆盖一个函数，该函数接收要加载的各个模块的路径，截取模块名称，并在r.js加载和编译模块时对文件进行lint。我是这样做的：

var requirejs = require('requirejs');
var options = {/*r.js options as JSON*/};
var oldNewContext = requirejs.s.newContext;
requirejs.s.newContext = function(){
    var context = oldNewContext.apply(this, arguments);
    var oldLoad = context.Module.prototype.load;
    context.Module.prototype.load = function(){
        var module = oldLoad.apply(this, arguments);

        if(/\.js$/.test(this.map.url) && !/^empty:/.test(this.map.url))
            console.log(this.map.url);

        return module;
    }
    return context;
}
requirejs.optimize(options)

然后，当您在模块上运行requirejs.optimize时，您应该将所有非空的JavaScript urls记录到控制台。您可以使用urls来链接文件，而不是将它们记录到控制台中。

Answer 2

先编译，再编译。只需具体说明您想要lint的文件并使用！忽略特定文件的前缀：

grunt.initConfig({
  lint: {
    // Specify which files to lint and which to ignore
    all: ['js/src/*.js', '!js/src/notthisfile.js']
  },
  requirejs: {
    compile: {
      options: {
        baseUrl: 'js/src',
        name: 'project',
        out: 'js/scripts.js'
      }
    }
  }
});

// Load the grunt-contrib-requirejs module.
// Do `npm install grunt-contrib-requirejs` first
grunt.loadNpmTasks('grunt-contrib-requirejs');

// Our default task (just running grunt) will
// lint first then compile
grunt.registerTask('default', ['lint', 'requirejs']);

Answer 3

我不喜欢重写r.js的方法，否则您可能会在特定版本上创建不需要的依赖项(如果r.js发生更改，您将需要更新代码)

这是我用于相同目的的代码，它利用了require的onBuildRead函数，以及javascript中的对象是通过引用传递的。我确保首先运行require build，然后lint js文件源代码。

缺点是您将在构建完成后进行编译。对于我的设置来说，这不是问题。

module.exports = function(grunt) {



var jsHintOptions = {
        options: {
            curly: true,
            eqeqeq: true,
            eqnull: true,
            browser: true,
            globals: {
                jQuery: true
            }
        },
        all: []  // <--- note this is empty! We'll fill it up as we read require dependencies
    };

var requirejsOptions = {
        compile: {
            options: {
                paths: {
                    "jquery": "empty:"
                },
                baseUrl: "./",
                name: "src/mypackage/main",
                mainConfigFile: "src/mypackage/main.js",
                out: 'build/mypackage/main.js',
                onBuildRead: function (moduleName, path, contents) {
                    jsHintOptions.all.push(path);   // <-- here we populate the jshint path array
                    return contents;
                }
            }
        }
    };

grunt.initConfig({
    pkg: grunt.file.readJSON('packages/mypackage.package.json'),
    requirejs: requirejsOptions,
    jshint: jsHintOptions
});

// load plugin that enabled requirejs
grunt.loadNpmTasks('grunt-contrib-requirejs');

// load code quality tool
grunt.loadNpmTasks('grunt-contrib-jshint');


grunt.registerTask('default', ['requirejs', 'jshint']);   // <-- make sure your run jshint AFTER require
};