语境

我尝试使用 Webpacker gem 将我们应用程序中的 Assets 移动到 webpack。应用程序很大,所以我需要做一部分。

到目前为止做了什么...

我成功地使用 javascript_pack_tag 调用了脚本

我导出一个 super 简单的模块:

# javascript/src/javascript/test.js'
const Direction = {
  log_to_console: function(){
    console.log('test');
  }
};
export default Direction;

然后在应用入口点导入
# javascript/packs/application.js
import Test from '../src/javascript/test.js'
Test.log_to_console();

最后在布局中渲染它:
# app/views/application.slim
= javascript_include_tag 'application'

结果是:“测试”字符串在浏览器控制台中可见。

问题

目前在整个应用程序中,我们在这样的 View 中使用模块:
# app/views/assets/javascripts/test.coffee
log_to_console = ->
  console.log('test');
@Test = { log_to_console }

# app/views/some/template.slim
javascript:
  Test.log_to_console()

但是在将模块移动到 webpack 后,我无法再访问 Test 模块。

所以我的问题是:

如何配置 webpacker gem 或重构上面的代码以使 log_to_console() 方法在 View /浏览器检查器中可用?

理想情况下,如果我们也可以在由链轮编译的旧 javascript 文件中访问它们。

最佳答案

我现在想出了这个解决方案。可能对遇到该问题的任何人都有帮助。

如果有人找到更好的解决方案,我很高兴在这里看到它;)。

现在我们所有需要在 View /其他咖啡文件中可见的模块/库,我只是通过 window 对象设置为全局可用。

import Foo from '../src/javascript/foo.js
window.Foo = Foo

我知道这是一个丑陋的反模式,但在我们更新我们的脚本之前作为临时解决方案工作得很好,更像是独立的包。

关于ruby-on-rails - Rails : Accessing JS module methods from files served by webpacker,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/50414220/

10-12 06:32