如何让 SonarQube 与 AngularJS 配合得很好？答案

【问题标题】：How to get SonarQube to play nicely with AngularJS?如何让 SonarQube 与 AngularJS 配合得很好？
【发布时间】：2014-04-07 22:22:01
【问题描述】：

我一直在研究使用 SonarQube 对一些 javascript 代码进行质量检查，但这段代码是使用 AngularJS 编写的。

SonarQube 规则之一检查函数中的行数 - 这似乎很合理 - 但在 AngularJS 中，函数用于定义控制器、服务和指令，并且这些函数可以变得非常大。从概念上讲，它们实际上更像是类定义，其中嵌套了其他函数。

理想情况下，我希望 SonarQube 检查内部函数的长度，可能还有排除内部函数的外部函数，但我不知道有什么方法可以做到这一点。

有没有其他人在使用 SonarQube 和 AngularJS 时遇到过这个问题，或者有人知道一个好的解决方案吗？

【问题讨论】：

我对AngularJS一无所知，但是你如何区分外部函数和内部函数？命名约定？还有什么？
“内部函数”是指在另一个函数内部声明的函数。在 AngularJS 中，这通常是一个匿名函数，它被声明并立即分配为“范围”对象的属性，该对象被传递给定义相关控制器、服务或指令的外部函数。例如，如果 Sonar 能够识别出除了声明和分配 10 个其他 100 行函数之外什么都不做的函数，它本身并不算作 1000 行函数。
在此处查看“Simple Spicy Controller”示例（它位于页面的一半左右 - 您需要单击该示例上的 app.js 按钮才能查看代码），非常简单如何在 AngularJS 中声明控制器的示例：docs.angularjs.org/guide/controller
好的，我明白了。但是有一个问题：为什么这些外部功能可能会变大？没有其他方法可以设计它们吗？内部函数的内部函数？
这就是使用 AngularJS 框架的模式。控制器是一个功能，其工作是将其他功能分配给范围。对于大页面或复杂的控件，可能会涉及到许多内部函数。在这种情况下，控制器实际上更像是一个类声明。您可以在使用控制器将它们分配给范围之前，在控制器外部定义您想要的函数，而不是使用内部函数，但是这些函数将是全局范围的，这并不是您真正想要的。

标签： javascript angularjs sonarqube

【解决方案1】：

一种解决方案是在your self-executing function 中分别声明所有方法。

(function(){
    var controller = function(dependency){
         //...
    },

    someDirective = function(dependency){
        //...
    },

    //Finally, your module
    module = angular.module("MyMod", []);

    module.controller("MyController", ['dependency', controller]);
    module.directive("someDirective", ['dependency', someDirective]);
}());

对于某些开发人员来说，这绝对是一种不舒服的模式，但这是将您的功能分解为 SonarQube 的更小部分的一种方式。

【讨论】：

您的示例并不能完全解决问题，但我想如果您在自执行函数中但在控制器函数之外声明您的范围方法（例如），然后只是分配它们，它可以做到在里面。但是你仍然有函数嵌套在一个函数中，只是外部函数是自执行的 - 还是 SonarQube 忽略了那个？
在对此进行了进一步调查后，不幸的是，SonarQube 将自执行函数视为另一个函数，并将行数检查也应用于此，因此这根本无法解决问题。似乎 SonarQube 真的没有准备好与 Javascript 一起正常工作，因为这是限制范围的常见通用模式，并且真的不应该受到与普通函数相同的限制。