让Jquery和Bootstrap与Rails 6一起使用

Question

我是Rails的新手，正在努力使Jquery和Bootstrap与Rails 6一起使用。我认为这与将应用程序从Rails 5切换到Rails 6以及使用webpacker加载Jquery而不是将其作为a加载有关。宝石。我已经按照说明进行了操作，但是似乎仍无法正常工作。有人帮助我解决了一个更具体的问题，然后让我将其粘贴到视图中，然后似乎使它起作用：

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>

但是，这似乎是一种解决方法，我希望Jquery在所有视图中都可用。以下是/javascript/packs/application.js的副本：

require("jquery")
require("@rails/ujs").start()
require("turbolinks").start()
require("@rails/activestorage").start()
require("channels")
require("bootstrap/dist/js/bootstrap")

import '../stylesheets/application'
import './bootstrap_custom.js'


//= require jquery3
//= require popper
//= require bootstrap-sprockets

和/config/webpack/environment.js：

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

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

module.exports = environment

我没有得到Require("...")和//= require ...之间的区别？ //=是应该转换为Require("...")的旧记法吗？

我还需要require("jquery")和//= require jquery3吗？我认为不是。如果是这样，我应该删除哪一个？

在/apps/views/layouts/Application.html.erb中，标头中包含以下内容：

<%= stylesheet_pack_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>

Answer 1

我为此奋斗了几天，所以希望我的经验能对您有所帮助：）