如何在Rails 6的视图中使用JQueryUI [英] How to use JQueryUI in views in Rails 6
问题描述
我在Rails 6应用程序中使用JQuery和JQueryUI遇到困难.
I am having difficulty using JQuery and JQueryUI in a Rails 6 app.
JQuery和JqueryUI都可以在application.js中使用
JQuery and JqueryUI both work in application.js
但是,JQueryUI在视图中不起作用.如何在两种情况下都可以使用?我的代码在下面.
HOWEVER, JQueryUI is not working in views. How do I make it work in both cases? My code is below.
我跑了yarn add jquery
我跑了yarn add jquery-ui-dist
在 environment.js 中:
const { environment } = require('@rails/webpacker')
const webpack = require('webpack')
environment.plugins.prepend('Provide',
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery'
})
);
const aliasConfig = { 'jquery': 'jquery/src/jquery', 'jquery-ui': 'jquery-ui-dist/jquery-ui.js' };
environment.config.set('resolve.alias', aliasConfig);
module.exports = environment
在 application.js 中:
require("@rails/ujs").start()
require("@rails/activestorage").start()
require("channels")
require("jquery")
require("jquery-ui");
require("custom/scripts")
我在 custom/scripts.js 和 packs/search.js
custom/scripts.js 已加载到application.js中,如下所示:
custom/scripts.js is loaded in application.js and looks like this:
$(document).ready(function(){
var test = $().jquery
console.log('custom/scripts.js JQuery version ==> ' + test);
var test_ui = $.ui ? $.ui.version || "pre 1.6" : 'jQuery-UI not detected';
console.log('custom/scripts.js UI version ==> ' + test_ui);
});
packs/search.js 通过以下方式加载到视图中
packs/search.js is loaded in the view with
<%= javascript_pack_tag "search" %>
packs/search.js 看起来像这样(与custom/scripts.js完全相同):
packs/search.js looks like this (exact same as custom/scripts.js):
$(document).ready(function(){
var test = $().jquery
console.log('packs/search.js JQuery version ==> ' + test);
var test_ui = $.ui ? $.ui.version || "pre 1.6" : 'jQuery-UI not detected';
console.log('packs/search.js UI version ==> ' + test_ui);
});
控制台中的结果:
custom/scripts.js JQuery version ==> 3.5.1
custom/scripts.js UI version ==> 1.12.1
packs/search.js JQuery version ==> 3.5.1
packs/search.js UI version ==> jQuery-UI not detected
推荐答案
问题可能是Webpack如何解析插件.我已经删除了这一行
The problem is maybe how Webpack resolves the plugin. I have removed this line
$: 'jquery'
在environment.js
中的
似乎很有效!
in environment.js
and seem likes it works!
这篇关于如何在Rails 6的视图中使用JQueryUI的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!