Question

我正在尝试使用Angular和Browserify构建项目。我的controllers.js文件看起来像这样......

'use strict';

module.exports.testController = function($scope){
    $scope.message = 'Controller 1';
    console.log( 'hello' );
};

正如您所料，这会产生三个掉毛错误。

使用Strict
'module'未定义
'console'未定义

我确实找到了一些解决方案here，它允许JSHint处理Node.js文件，方法是将jslint node: true放在文件的顶部，如下所示

   /*jslint node: true */
   'use strict';

    module.exports.testController = function($scope){
        $scope.message = 'Controller 1';
        console.log( 'hello' );
    };

然而，这显然修复了太多; 'console.log（...）'应该仍未定义。

有没有人知道如何在Browserify中使用JSHint？

Answer 1

从版本2.5.3开始，JSHint支持browserify标志。

与所有标志一样，您可以直接在源文件中使用它：

/*jshint browserify: true */
// browserify code here

或将其添加到.jshintrc文件中：

{
   "browserify": true
}

Answer 2

我讨厌回答我自己的问题，感觉就像是盗窃，但不过，这就是答案。有两种方法可以为这只特殊的猫提供皮肤，但这个解决方案可能是“正确的” ......

修改.jshintrc

你应该做的第一件事就是修改你的.jshintrc

"globals": {
    "define": false
}

变为

"globals": {
    "define": false,
    "module": false
}

修改代码

现在你需要像这样修改代码

module.exports = (function(){

    'use strict';

    var myComponent = {};

    myComponent.testController = function($scope){

        $scope.message = 'hello';
        console.log( 'Hello' );

    };

    myComponent.testDirective= function($scope){

        $scope.message = 'hello';
        console.log( 'Hello' );

    };

    return myComponent;

}());

现在JSHint将显示console.log的linting错误，但不会显示modules的linting错误。这是.jshintrc ammend的礼貌。

修复了use strict linting错误，我将所有代码包装在函数中。

需要（）

更进一步，因为我们使用的是browserify，所以我们还需要require()。所以我需要再次修改.jshintrc。

"globals": {
    "module": false,
    "require": false
}

注意：我已从全局变量中删除define，因为我没有使用它。

你如何一起使用JSHint和Browserify？

2 个答案:

修改.jshintrc

修改代码

需要（）