javascript - Rails asset pipeline编译js报错

Question

当我处于开发模式时，一切正常，我有以下 .js 导入顺序:

<!-- 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>

在生产中，它就像下面这样:

<!-- 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>

问题是我在生产模式中遇到了一些我无法理解的错误。第一个错误是:

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

倒计时的调用是在application.js导入之后，为什么会这样呢？内联脚本是否可能在 application.js 之前执行？如果是这样，为什么在使用分离文件的开发中不会发生这种情况？

第二个错误是:

Uncaught TypeError: Cannot call method 'addEventListener' of null 

更新:

如果我设置一个 setInterval，我会解决第一个错误，如下所示:

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

                  function() {
                            // callback function
                  }
              );

        });
   });

</script>

所以我认为内联脚本首先被执行。这很奇怪。

Answer 1

您看到该错误是因为之前的错误:Uncaught TypeError: Cannot call method 'addEventListener' of null

这发生在生产中，因为所有 JS 都在一个文件中，如果出现错误，则不会执行其余部分。它在开发中有效，因为 5modalEffects.js 是一个单独的文件，因此该文件中的错误不会影响任何其他文件。

我设法通过将 .md-close 类添加到 div#modal-1 中的关闭模态按钮来修复模态错误，这解决了另一个问题: )