javascript - Webpacker 不检测文件 javascript/packs/application.js 中的导入函数

Question

我在文件 dashboard.js 中有这个函数

var Dashboard = function(){

 return {
   init: function(){
     console.log("Hi from Dashboard with webpacker")
   }
 }
}();

使用 webpacker 我在文件 javascript/packs/application.js 中导入这个

import '../src/api/dashboard.js';

但是当我想像这样在 View 中使用 init 函数时

<script type="text/javascript">
  $(document).ready(function() {
    Dashboard.init();
  });
</script>

我得到了错误

 (index):861 Uncaught ReferenceError: Dashboard is not defined
  at HTMLDocument.<anonymous> ((index):861)

我不确定我做错了什么，我也试过这样导入文件

import Dashboard from '../src/api/dashboard.js';

提前致谢。

Answer 1

我知道你在 5 个月前问过这个问题，而我(还)不是 JS 专家，所以这可能不是最佳(也不是最干净)的解决方案。但无论如何，我遇到了同样的问题，下面是我的处理方式。

在添加 Webpacker 之前，这个函数是由点击按钮触发的(而且它工作得很好):

function validateFile(inputFile) {
  ..
}

但是在添加 Webpacker 之后我得到了 Uncaught ReferenceError 就像你一样。现在看起来像这样:

window.validateFile = function(inputFile) {
  ..
}

它就像一个魅力!

希望对你有帮助，如果没有 - 那么其他人:)