Rails: 从 webpacker 提供的文件访问 JS 模块方法
Rails: Accessing JS module methods from files served by webpacker
上下文
我尝试使用 Webpacker gem 将应用程序中的资产移动到 webpack。应用很大,所以我需要部分地做。
到目前为止做了什么...
我成功地使用 javascript_pack_tag
调用了脚本
我导出了一个超级简单的模块:
# 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'
结果是:"Test" 字符串在浏览器控制台中可见。
问题
目前在整个应用程序中,我们在这样的视图中使用模块:
# 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()
方法在 views/browser 检查器中可用?
理想情况下,如果我们也可以在链轮编译的旧 javascript 文件中访问它们。
我现在找到了解决方案。可能对遇到该问题的任何人都有帮助。
如果有人找到更好的解决方案,我会很高兴在这里看到它;)。
现在我们所有 modules/libraries 需要在 views/other 咖啡文件中可见,我只是通过 window
对象设置为全局可用。
import Foo from '../src/javascript/foo.js
window.Foo = Foo
我知道这是丑陋的反模式,但在我们更新脚本之前作为临时解决方案效果很好,表现得更像独立包。
上下文
我尝试使用 Webpacker gem 将应用程序中的资产移动到 webpack。应用很大,所以我需要部分地做。
到目前为止做了什么...
我成功地使用 javascript_pack_tag
我导出了一个超级简单的模块:
# 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'
结果是:"Test" 字符串在浏览器控制台中可见。
问题
目前在整个应用程序中,我们在这样的视图中使用模块:
# 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()
方法在 views/browser 检查器中可用?
理想情况下,如果我们也可以在链轮编译的旧 javascript 文件中访问它们。
我现在找到了解决方案。可能对遇到该问题的任何人都有帮助。
如果有人找到更好的解决方案,我会很高兴在这里看到它;)。
现在我们所有 modules/libraries 需要在 views/other 咖啡文件中可见,我只是通过 window
对象设置为全局可用。
import Foo from '../src/javascript/foo.js
window.Foo = Foo
我知道这是丑陋的反模式,但在我们更新脚本之前作为临时解决方案效果很好,表现得更像独立包。