我尝试集成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/