angular-ui / ui-router

The de-facto solution to flexible routing with nested views in AngularJS
http://ui-router.github.io/
MIT License
13.56k stars 3.01k forks source link

Angular 1.X, using ui-router with requirejs :: Error :: @UIRouter/core.js not found #3670

Closed phanivaranasi closed 6 years ago

phanivaranasi commented 6 years ago

Hi Team,

using legacy angular-ui-router.js is not throwing any error, but i'm not able to work with state changes. So in order to use state changes I have migrated my to ui-router-angularjs.js Could any one suggest the fix, so that I can use ui-router-angularjs

I'm trying to use new ui-router in my application using (requirejs & angularjs)

Below is my main.js

 'use strict';
require.config({
    urlArgs: "v=" + (new Date()).getTime(),
    paths: {
        "angular": "../node_modules/angular/angular.min",
        "ngamd": "../node_modules/angular-amd/angularAMD",
        "ngload": "../nodes_modules/angular-amd/ngload",
        "ngroutecore":"../node_modules/@uirouter/core/_bundles/ui-router-core",
        "ngroute":"../node_modules/@uirouter/angularjs/release/ui-router-angularjs.min",
        "jquery": "script/jquery-3.3.1.min",
        "bootstrap": "../assets/js/bootstrap.min",
        "owlcarousel": "../assets/js/owl.carousel.min",
        "flexcarousel":"../assets/js/jquery.flex-carousel",
        "sekeltab": "../assets/js/skeletabs.min",
        "swiper": "../assets/js/swiper.min",
        "tether": "../assets/js/tether.min",
        "ui-bootstrap":"../node_modules/angular-ui-bootstrap/dist/ui-bootstrap",
        "ui-bootstrap-tmp":"../node_modules/angular-ui-bootstrap/dist/ui-bootstrap-tpls",
        "appScript":"script/indexscript",
        "appConfig":'script/config'
    },
    shim: {
        "angular": { exports: 'angular' },
        "ngamd": ['angular'],
        "ngload": ['angular', 'ngamd'],
        "ngroutecore":['angular'],
        "ngroute": ['angular'],
        "bootstrap": ['jquery'],
        "owlcarousel": ['bootstrap', 'jquery'],
        "flexcarousel":['bootstrap','jquery'],
        "sekeltab": ['jquery'],
        "swiper": ['jquery'],
        "tether":['jquery'],
        "ui-bootstrap":['bootstrap'],
        "ui-bootstrap-tmp":['ui-bootstrap'],
        "appScript":['bootstrap','swiper','owlcarousel','sekeltab'],
        "appConfig":['appScript']
    },
    deps: ['app']
});

Below is my app.js

'use strict';
define(
    ['ngamd',
        'ngroutecore',
        'ngroute',
        'jquery',
        'router',
        'tether',
        'bootstrap',
        'owlcarousel',
        'flexcarousel',
        'sekeltab',
        'swiper',
        'ui-bootstrap',
        'ui-bootstrap-tmp',
        'appScript', 'appConfig'], function (ngamd, ngroute, jq, config) {
            var app = angular.module('ncellapp', ['ui.router', 'ui.bootstrap']);
            app.config(config);
            app.run(function ($rootScope) {
                console.log("app run");
                $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams, options) {
                    console.log('toState', toState);
                })
            })
            return ngamd.bootstrap(app);
        }); 

Now issues is that when I'm trying to browser my application, facing error, uirouter/core.js is not found. image

christopherthielen commented 6 years ago

Can you post a reproduction, or better yet a link to a repository that reproduces this issue?

RavishankarMSGR commented 3 years ago

Hi @phanivaranasi , I am facing the same issue which you described above, is the above issue fixed. If fixed how have you fixed it can you please share me some idea