如何使用 Webpacker 使 jquery 可用于 sprockets？

Question

我刚刚开始在现有应用程序中尝试使用 Webpacker。

从我读过的所有内容来看，我的理解是 Webpacker 和 Sprockets 可以共存，并且在 Webpacker 中编译的库（例如，jquery）可以通过全局变量提供给 Sprokets。

但是我所有的 jquery 资产管道都在筹集 ReferenceError: Can't find variable: $

是我理解错了，还是我的代码有错误？

我已经添加了 jquery

yarn add jquery

并赋值给environment.js

中的变量

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

const webpack = require('webpack');
environment.plugins.prepend('Provide', new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery'
}));

module.exports = environment;

这个有效：

#javascript/packs/application.js
$(function () {
    console.log('Hello World from Webpacker via JQUERY');
});

这不是

#assets/javascripts/application.js
$(function () {
    console.log('Hello World from Sprockets via JQUERY');
});
# ReferenceError: Can't find variable: $

预期的行为是什么？

Answer 1

最后，从 webpacker 中向全局公开 jQuery 相对容易。但是很难找到有关如何执行此操作的文档！希望这可以节省其他人的搜索。

添加公开加载器

yarn add expose-loader -D

然后在config/webpack/environment.js中添加如下配置

environment.loaders.append('expose', {
    test: require.resolve('jquery'),
    use: [{
        loader: 'expose-loader',
        options: '$'
    }, {
        loader: 'expose-loader',
        options: 'jQuery',
    }]
})

然后我能够从资产管道中删除 jquery，重新启动服务器，链轮中所有剩余的 jquery 功能继续按预期运行。

如何使用 Webpacker 使 jquery 可用于 sprockets？

How to make jquery available to sprockets using Webpacker?

ruby-on-rails

webpacker