app.min.js：7错误：[$ rootScope：infdig]达到10个$ digest（）迭代。 流产！ 观察者在最近5次迭代中被解雇

Question

here is the error that the browser throws in each time I npm start my app.

and here is my bower.json file:

{
    "name": "myapp",
    "version": "1.3.0",
    "authors": "My example",
    "description": "AngularJs Bootstrap example",
    "keywords": ["AngularJS", "admin", "admin", "dashboard", "admin", "panel", "app", "charts", "components", "flat", "flat", "ui", "responsive", "responsive", "layout", "ui", "kit", "ui", "route", "web", "app", "widgets"],
    "license": "ISC",
    "homepage": "http://example/com",
    "private": true,
    "ignore": ["**/.*", "node_modules", "bower_components", "test", "tests"],
    "dependencies": {

        "jquery": "~2.1.3",
        "fastclick": "~1.0.6",

        "angular": "~1.5.x",
        "angular-animate": "~1.5.x",
        "angular-cookies": "~1.5.x",
        "angular-resource": "~1.5.x",
        "angular-sanitize": "~1.5.x",
        "angular-touch": "~1.5.x",
        "angular-ui-router": "~0.3.x",
        "ngstorage": "~0.3.x",
        "angular-translate": "~2.11.x",
        "angular-translate-loader-url": "~2.11.x",
        "angular-translate-loader-static-files": "~2.11.x",
        "angular-translate-storage-cookie": "~2.11.x",
        "angular-translate-storage-local": "~2.11.x",
        "oclazyload": "~0.6.3",
        "angular-breadcrumb": "~0.4.x",
        "angular-bootstrap": "~1.1.x",
        "angular-loading-bar": "~0.9.x",
        "angular-scroll": "~1.0.x",
        "angular-moment": "~1.0.x",
        "AngularJS-Toaster": "~2.0.x",
        "angular-bootstrap-nav-tree": "*",
        "angular-ladda": "~0.4.x",
        "ng-table": "~0.5.4",
        "angular-ui-select": "~0.11.1",
        "angular-ui-utils": "mask-0.2.2",
        "ngImgCrop": "~0.3.2",
        "angular-file-upload": "~1.1.5",
        "angular-aside": "~1.1.3",
        "angular-truncate": "*",
        "angular-sweetalert-promised": "~1.0.4",
        "angular-elastic": "~2.4.2",
        "ngmap": "~1.4.2",
        "tc-angular-chartjs": "~1.0.9",
        "angular-ui-switch": "~0.1.0",
        "angular-ckeditor": "~0.3.2",
        "angular-bootstrap-calendar": "~0.7.0",
        "angular-xeditable": "~0.1.8",
        "checklist-model": "~0.2.4",
        "ng-nestable": "~0.0.1",
        "ng-flow": "~2.6.0",
        "v-accordion": "~1.2.1",

        "components-modernizr": "~2.8.3",
        "moment": "~2.8.3",
        "perfect-scrollbar": "~0.6.1",
        "ladda": "~0.9.7",
        "sweetalert": "~0.4.2",
        "chartjs": "~1.0.2",
        "jquery.sparkline.build": "~2.1.3",
        "ckeditor": "~4.4.7",
        "jquery-nestable": "v1.0",
        "spin.js": "~2.0.2",
        "bootstrap-touchspin": "~3.0.1",
        "select2": "~4.0.0",
        "select2-bootstrap-css": "~1.4.6",
        "selectize": "~0.12.0",

        "animate.css": "~3.2.0",
        "font-awesome": "~4.2.0",
        "themify-icons": "~0.1.0",
        "bootstrap": "~3.3.7",
        "bootstrap-rtl": "~3.3.1"
    },
    "resolutions": {
        "angular": "~1.5.x"
    }
}

when I run install my bower dependencies, I get a lot of prompts to choose which version of the packages I want to install.
Can somebody tell me where the problem lies actually?

Answer 1

This is more likely due to the code in your application and is not related to your bower dependencies. Can you post your code?

Answer 2

You appear to be suffering from two separate problems.

The first is an angular error generated when angular detects that its digest cycle is being thrown into an infinite loop (you can read more about it here: https://docs.angularjs.org/error/ $rootScope/infdig). Check your code for issues where a watcher might be updating the value being watched or some other circular scope changes.

The second problem is regarding bower conflicts with your libraries. Bower attempts to enforce a flat hierarchy among packages it clones, which is desirable in the browser because it reduces filesize/payload. But in order to do this, it has to make sure that it does not install multiple versions of various packages and it doesn't know which versions it should be using, so it requires input from the user to determine. You most likely have many packages that are requesting conflicting versions of their dependencies. You can use the bower interface to select which version is your preference or do so manually ( How to resolve Bower dependency version conflicts? has good instructions for doing so).

Another thing you might try with bower is to use specific version numbers for your packages. Using ~ or .x allows bower to include packages according to semver rules as explained here: What is the bower (and npm) version syntax? . This makes conflicts among dependencies more likely. It's also unusual to use both ~ and .x as they both perform the same function.