WARNING: Tried to load angular more than once (SOLVED)

ionic-v1
1

Hi

Please can someone tell me how to fix this

my screen is blank because of this error

ionic.bundle.js:33809 WARNING: Tried to load angular more than once.

Thanks

2

Are you trying to include the angular lib and the ionic lib in the index.html together? Angular is included in the Ionic file and so isnt needed.

If not can you post the scripts you’ve added to your index.html file?

1 Like
3

hi thanks for getting back to me

I am creating an app with multi different features one including a quiz whenever i take the quiz out the app works perfectly

please would I be able to email you the zip file over so that you can have a look at whats going on for me?

thanks

4

No bother ill have a look. If you have the code somewhere on GitHub that would be far handier but if not my email is jamesdesbyrne@gmail.com

5

Can you paste your index.html here?

1 Like
6 
          <!DOCTYPE html>
           <html>
          <head>
           <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, 
            user-scalable=no,  width=device-width">
<title></title>

<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">

<!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
<link href="css/ionic.app.css" rel="stylesheet">
-->

<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>

<!-- cordova script (this will be a 404 during development) -->
  
 <!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<!-- firebase & angularfire libraries -->
<script src="lib/firebase/firebase.js"></script>
<script src="lib/angular-fire/angularfire.min.js"></script>
<script src="lib/angular-moment/moment.js"></script>
<script src="lib/angular-moment/angular-moment.js"></script>
  
       <script src="cordova.js"></script>
  
                  <!-- for Google Maps -->
               <script src="lib/lodash/dist/lodash.min.js"></script>
           <script src="lib/angular-google-maps/dist/angular-google-maps.min.js"></script>

                     <!-- for Google Places -->
               <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js
                 ?l  libraries=places"></script>
                <script type="text/javascript" src="lib/angularjs-google-places/dist/angularjs-google
                     -places.min.js"></script>
  
                <!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>  
<script src="js/quiz.js"></script>
        </head>

              <body>
                <!--
                The nav bar that will be updated as we navigate between views.
               -->
            <ion-nav-bar class="bar-header bar-assertive">
             <ion-nav-back-button>
                 </ion-nav-back-button>
               </ion-nav-bar>
              <!--
                  The views will be rendered in the <ion-nav-view> directive below
                   Templates are in the /templates folder (but you could also
                  have templates inline in this html file if you'd like).
                  -->
              <ion-nav-view></ion-nav-view>

           </body>
          </html>
7

You are including the ionic bundle, which includes angular, twice.

8

thank you its got rid of the warning but theres still a blank screen

9 
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no,  width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>

    <script src="cordova.js"></script>

    <!-- firebase & angularfire libraries -->
    <script src="lib/firebase/firebase.js"></script>
    <script src="lib/angular-fire/angularfire.min.js"></script>
    <script src="lib/angular-moment/moment.js"></script>
    <script src="lib/angular-moment/angular-moment.js"></script>

    <!-- for Google Maps -->
    <script src="lib/lodash/dist/lodash.min.js"></script>
    <script src="lib/angular-google-maps/dist/angular-google-maps.min.js"></script>

    <!-- for Google Places -->
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
    <script type="text/javascript" src="lib/angularjs-google-places/dist/angularjs-google-places.min.js"></script>

    <!-- your app's js -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/services.js"></script>
    <script src="js/quiz.js"></script>
</head>

<body>
<!--
The nav bar that will be updated as we navigate between views.
-->
<ion-nav-bar class="bar-header bar-assertive">
    <ion-nav-back-button>
    </ion-nav-back-button>
</ion-nav-bar>
<!--
    The views will be rendered in the <ion-nav-view> directive below
     Templates are in the /templates folder (but you could also
    have templates inline in this html file if you'd like).
    -->
<ion-nav-view></ion-nav-view>

</body>
</html>
10

ive fixed the issues now thank you everyone

2 Likes
11

Maybe some time has passed, but… how did you solve?
I have an old app with Ionic 1 and doesn’t start on Android 11.
I had ionic.bundle.js and angular.min.js both included in index.html. Removed the latter, but it still doesn’t work.