Rails:从 webpacker 提供的文件访问 JS 模块方法

2024-03-14

Context

我尝试使用 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模块不再。

所以我的问题是:

如何配置webpackergem 或重构上面的代码以使log_to_console()视图/浏览器检查器中可用的方法吗?

理想情况下,我们还可以在由 sprocket 编译的旧 JavaScript 文件中访问它们。


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

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

现在,我们所有需要在视图/其他咖啡文件中可见的模块/库,我只是通过以下方式设置为全局可用window object.

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

我知道这是丑陋的反模式,但在我们更新脚本使其行为更像独立包之前,它可以作为临时解决方案。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Rails:从 webpacker 提供的文件访问 JS 模块方法 的相关文章

  • 如何在控制器内部使用 auto_link

    在我的控制器中 我需要构建一个 JSON 对象 如何在控制器内使用 auto link 现在它错误 NoMethodError undefined method mail to for
  • 强参数不起作用

    使用 Ruby 1 9 3 Rails 3 2 13 Strong parameters 0 2 1 我遵循了教程和railscasts中的每一个指示 但我无法让strong parameters工作 这应该是非常简单的事情 但我看不出错误
  • Ruby on Rails 中的三重连接

    我对 Ruby on Rails 中的关联有疑问 应用程序中有项目 用户 角色和组 项目属于一个有用户的组 一个用户可以属于多个不同的组 但只能在该组中拥有一个特定的角色 例如 在一个组中 用户是项目所有者 但在另一个组中 他是作家 使用
  • Googlebot 收到现有模板缺少模板错误

    在过去的几天里 当谷歌机器人尝试访问我们的主页 欢迎 索引 时 我们开始收到缺少模板的错误 我已经盯着这个看了几个小时 知道我只是错过了一些简单的东西 A ActionView MissingTemplate occurred in wel
  • rvm编译安装ruby 2.5.0出错

    我正在尝试使用 rvm 安装 ruby 2 5 0 但出现错误 我在 Ubuntu 18 16 和现在的 Linux Mint Cinnamon 上尝试过 基本上我在运行安装 ruby 的代码之前所做的是 打开 GPG 密钥https rv
  • 如何以 Rails 方式处理 JavaScript 事件(例如“link_to :remote”)?

    我正在使用 Ruby on Rails 4 我想以 Rails 方式处理 JavaScript 事件 也就是说 例如 假设我有以下内容 link to destroy article path article method gt delet
  • 我们能否知道回形针下载何时完成?

    我有一个应用程序 我需要知道用户的 Rails Paperclip 文件下载时间complete 我的应用程序设置为与 Amazon S3 交互 当用户收到完整的文件时 我需要运行 JavaScript 函数 我怎样才能做到这一点 跟踪天气
  • 自动测试无限循环

    我在 Rails 项目中使用自动测试时遇到了一个问题 即当测试失败时 即 我修改了测试文件并且自动测试自动运行测试 自动测试会不断尝试运行测试 当然每次都会失败 因为文件尚未被修改 而不是等到文件再次保存 当咆哮通知打开时 当我试图修复代码
  • @apply 在 Laravel Mix 中的 Vue 组件内不起作用

    我在 Laravel 中使用 Tailwind CSS 和 VueJS 组件 如下所示
  • Rails 注释分段错误

    有一些问题围绕着这个问题 但没有什么真正能满足我的需求 After I bundle install下面列出了我的 Gemfile 我运行annotate并出现以下错误 Users nickcoelius rvm gems ruby 1 8
  • Rails:CSRF 令牌不工作但已设置

    我在 Heroku 上有我的 Rails 3 应用程序 当我发送银行信息时 我得到 WARNING Can t verify CSRF token authenticity但我的 CSRF 令牌已设置 https gist github c
  • Rails Active Admin css 与 Twitter Bootstrap css 冲突

    我对 Rails 资产管道有点陌生 所以我可能做错了什么 我正在尝试为我的后端使用 Active Admin 为我的前端应用程序使用 twitter bootstrap css 我将 bootstrap css 添加到 应用程序 资产 样式
  • 资产管道弃用警告 tsort.rb:226

    我的 Rails 4 2 在开发中运行良好 但在生产环境中我收到以下警告 DEPRECATION WARNING The configuration option config serve static assets has been re
  • 目前最流行的 Ruby on Rails AUTHORIZATION gem/plugin 是什么? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • Rails 控制台无法运行

    rbenv 红宝石版本 2 6 6 导轨版本 5 1 4 我正在较旧的代码库中工作 ruby 2 6 6 rails 5 4 1 这是我每天使用的代码库 我必须通过 rbenv 下载一个新的 ruby 版本作为单独的存储库 这样做在我的旧代
  • 测量两个字符串之间相似性的有效方法是什么? (编辑距离使堆栈太深)

    所以 我从这个开始 http en wikibooks org wiki Algorithm Implementation Strings Levenshtein distance Ruby http en wikibooks org wi
  • Ruby on Rails:如何使用 TCP 套接字连接 GPS 设备

    ruby 2 3 0p0 2015 12 25 修订版 53290 x86 64 linux 轨道 4 2 4 我正在使用 cloud9 IDE 和 webrick 服务器 我的项目是实时跟踪GPS 我想使用TCP连接与GPS跟踪设备进行通
  • 浏览器关闭时 Omniauth 会话过期

    在我的 Rails 3 应用程序中 我使用 Omniauth 进行用户身份验证部分 fb twitter 实际上我遵循这个 https github com RailsApps rails3 mongoid omniauth https g
  • 使用 Ruby aws-sdk 跟踪文件到 S3 的上传进度

    首先 我知道SO中有很多与此类似的问题 在过去的一周里 我读了大部分 如果不是全部 但我仍然无法让这项工作为我工作 我正在开发一个 Ruby on Rails 应用程序 允许用户将 mp3 文件上传到 Amazon S3 上传本身工作正常
  • 即使在急切加载之后,belongs_to 关联也会单独加载

    我有以下关联 class Picture lt ActiveRecord Base belongs to user end class User lt ActiveRecord Base has many pictures end 在我的

随机推荐