Вопрос

When I'm in development mode, everything works and I have the following .js import order:

<!-- Scripts -->
<script src="/assets/jquery/jquery.min.js?body=1"></script>
<script src="/assets/jquery-ujs/src/rails.js?body=1"></script>
<script src="/assets/1modernizr.custom.js?body=1"></script>
<script src="/assets/2rainyday.0.1.2.min.js?body=1"></script>
<script src="/assets/3xrain_init_youtube.js?body=1"></script>
<script src="/assets/3xxbootstrap.min.js?body=1"></script>
<script src="/assets/4classie.js?body=1"></script>
<script src="/assets/5modalEffects.js?body=1"></script>
<script src="/assets/6jquery.placeholder.js?body=1"></script>
<script src="/assets/7jquery.custom.js?body=1"></script>
<script src="/assets/8script.js?body=1"></script>
<script src="/assets/application.js?body=1"></script>
<script>

    $(document).ready(function(){
        $("#countdown").countdown({
                    date: "3 march 2014 12:00:00",
                    format: "on"
                },

                function() {
                    // callback function
                });
    });

</script>

And in production, it's like the following:

<!-- Scripts -->
<script src="/assets/application-afbc85ff07d9057a50dee5713b8bccdf.js"></script>
<script>

    $(document).ready(function(){
        $("#countdown").countdown({
                    date: "3 march 2014 12:00:00",
                    format: "on"
                },

                function() {
                    // callback function
                });
    });

</script>

The problem is I'm getting some erros in production mode that I can't understand. The First error is:

Uncaught TypeError: Object [object Object] has no method 'countdown'

The call to countdown is after the import of the application.js, so why is it happening? Is it possible that the inline script is being executed before application.js? If so, why that does not happen in development with separated files??

The second error is:

Uncaught TypeError: Cannot call method 'addEventListener' of null 

Update:

If I put a setInterval I solve the first error, like this:

<script>
    $(document).ready(function(){
        setInterval(1000, function(){
              $("#countdown").countdown({
                  date: "3 march 2014 12:00:00",
                  format: "on"
                  },

                  function() {
                            // callback function
                  }
              );

        });
   });

</script>

So I think the inline script is being executed first. That's very weird.

Это было полезно?

Решение

You're seeing that error because of the one before it: Uncaught TypeError: Cannot call method 'addEventListener' of null

This happens in production because all the JS is in one file and if there's an error then the rest of it isn't executed. It works in development because 5modalEffects.js is a separate file so the error in that file doesn't affect any others.

I managed to fix the modal error by adding the .md-close class to the close modal button inside div#modal-1 and this solved the other issue :)

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top