Select2 Css не загружается через пряжу или прекомпиляцию ресурсов - PullRequest
0 голосов
/ 19 сентября 2019

Я сталкиваюсь со странной проблемой, когда все работает как положено, кроме select2.У меня есть приложение Rails 6.0.0 и установленное select2 через yarn add 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 выпадающий список

Когда я перехожу на вкладку Source в инструментах разработчика Chrome, в папке node_modules отображается только папка select2/dist/js,Я пробовал precompiling и clobbering активы, но не работает.Все это работает нормально в моем локальном, вызывая только проблему на рабочем сервере.

Редактировать:

Моя продукция. Rb

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

1 Ответ

0 голосов
/ 19 сентября 2019

Если вы включаете CSS в app/javascripts/packs/application.js, убедитесь, что app/views/layouts/application.html.erb также использует stylesheet_pack_tag (см. Раздел «Использование» в документе webpacker).

В противном случае, если у вас есть stylesheet_link_tag, вы можете использовать классический app/assets/stylesheets/application.css.

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