Select2 Css 未通过纱线或资产预编译加载

Question

我运行遇到了一个奇怪的问题，除了 select2 之外，一切都按预期工作。我有 Rails 6.0.0 应用程序并通过 yarn add select2 安装了 select2。

然后我将它添加到 application.js 文件中。文件如下所示。

    #app/javascripts/packs/application.js

    require("@rails/ujs").start()
    require("turbolinks").start()
    require("@rails/activestorage").start()
    require("channels")
    require('datatables.net')
    require('datatables.net-dt')
    require('datatables.net-bs4')
    require('select2')

    import  "bootstrap"
    import 'popper.js/dist/popper.js';
    import $ from 'jquery';
    global.$ = jQuery;
    import  "chart.js"
    import 'select2'; // globally assign select2 fn to $ element
    import 'select2/dist/css/select2.css';  // optional if you have css loader

    document.addEventListener("turbolinks:load", () => {
        setTimeout(function() {
          $('.success, .alert').fadeOut();
        }, 10000); 
    })

现在看起来像这样 select2 dropdown box

当我转到 chrome 开发人员工具中的源选项卡时，它只显示 node_modules 下的 select2/dist/js 文件夹。我已经尝试 precompiling 和 clobbering 资产但没有工作。整个这在我的本地运行没问题，只会在生产服务器中引起问题。

编辑：

我的production.rb

https://gist.github.com/rajanhcah/3ee13925b0ae305a6fe2c64013ab6534

Answer 1

如果您在 app/javascripts/packs/application.js 中包含 CSS，请确保 app/views/layouts/application.html.erb 也在使用 stylesheet_pack_tag（请参阅 webpacker 中的 "Usage" section文档).

否则，如果你有stylesheet_link_tag，你可以使用经典的app/assets/stylesheets/application.css。

# app/assets/stylesheets/application.scss
@import 'select2/dist/css/select2';

Select2 Css 未通过纱线或资产预编译加载

Select2 Css is not loading via yarn or assets precompile

ruby-on-rails

jquery-select2

yarnpkg

webpacker

ruby-on-rails-6