javascript - Rails 6 上未定义 Instantclick

标签 javascript ruby-on-rails instantclick.io

我尝试集成instantclick到我的 Rails 6 应用程序。我添加了instantclick.js file在我的 javascript/custom 文件夹中。然后,我将其导入 javascript/packs/application.js:

require("custom/instantclick")

我在布局的 body 标记末尾添加了以下行来初始化 instantclick:

...
            <script data-no-instant>InstantClick.init();</script>
      </body>
    </html>

然后,我在控制台中收到以下错误:

(index):404 Uncaught ReferenceError: InstantClick is not defined

我是 webpacker 的新手,也许我做错了什么。但是,会导入 instantclick.js 文件。知道我做错了什么吗?谢谢。

最佳答案

Webpack 的工作方式与 Sprockets 不同。您遇到的一件事是 webpack 不会向全局范围暴露任何内容。这意味着从脚本标记调用函数将无法按预期工作,除非您指示 webpack 将这些变量添加到 window 对象。

您的 instantclick.js 文件也无法识别模块,即它不会导出任何内容,例如使用 module.exports = InstantClick

不过,使用 webpack,您可以将其配置为同时执行这两项操作。您需要导出暴露InstantClick:

yarn add expose-loader exports-loader
// config/webpack/environment.js

const { environment } = require('@rails/webpacker')

environment.loaders.append('InstantClick', {
  test: /instantclick/,
  use: [{
    loader: 'expose-loader',
    options: 'InstantClick'
  },
    {
    loader: 'exports-loader',
    options: 'InstantClick'
  }]
})

module.exports = environment

当然还有更多东西需要学习和其他方法。以下是一些资源:

关于javascript - Rails 6 上未定义 Instantclick,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61116414/

相关文章:

javascript - 将我的数据 json 放入其他文件中并将其调用到我的 Controller 中

javascript - 购物车中的 WooCommerce 加号/减号按钮间歇性显示

ruby-on-rails - Ruby on Rails Controller 测试失败

ruby-on-rails - 当前的 ruby​​ 和 rails 资源 (2010)

ruby-on-rails - YouTube API v3 为所有 channel 返回 0 个订阅者

javascript - Momentjs future 一个月可节省开支

javascript - 如何停止 chrome 扩展程序?