Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Como configurar o datatables.net-bs4 (aplicando em um adminlte), gerenciado pelo yarn, em um projeto do Rails 6, que não usa o Webpacker?

Estou executando um projeto usando o Rails 6, mas sem usar o Webpacker. Contudo, as configurações para o datatables.net-bs4 (aplicando em um adminlte) não estão claras na documentação, para o contexto desse projeto. Assim, minha dúvida seria como realizar a configuração. Segue o atual estado dos arquivos:

  • package.json

    {
    "name": "proj",
    "private": true,
    "dependencies": {
      "@fortawesome/fontawesome-free": "^5.15.3",
      "@rails/actioncable": "^6.0.0",
      "@rails/activestorage": "^6.0.0",
      "@rails/ujs": "^6.0.0",
      "admin-lte": "^3.1.0",
      "bootstrap": "^4.6.0",
      "bootstrap-switch": "^3.1.1",
      "bootstrap4-toggle": "^3.6.1",
      "datatables": "^1.10.24",
      "datatables-buttons": "^1.0.3",
      "datatables-responsive": "^1.0.7",
      "datatables.net-bs4": "^1.10.0",
      "daterangepicker": "^3.1.0",
      "jquery": "^3.6.0",
      "popper.js": "^1.16.1",
      "turbolinks": "^5.2.0"
    },
    "version": "0.1.0",
    "devDependencies": {
    
    }
    }
  • app/assets/javascripts/application.js

//= require turbolinks
//= require jquery
//= require rails-ujs
//= require theme/adminlte
//= require_tree .
  • app/assets/javascripts/tables.js
//= require bootstrap
//= require datatables.net-bs4
//= require datatables-responsive
//= require datatables-buttons

$.extend(true, $.fn.dataTable.defaults, {
  "responsive": true,
  "lengthChange": false,
  "autoWidth": false,
  ....
  }
});
  • app/assets/stylesheets/application.scss
@import 'bootstrap/scss/bootstrap';
@import 'theme/adminlte';
@import "users";

$fa-font-path: '@fortawesome/fontawesome-free/webfonts';
@import '@fortawesome/fontawesome-free/scss/fontawesome';
@import '@fortawesome/fontawesome-free/scss/brands';
@import '@fortawesome/fontawesome-free/scss/solid';
@import '@fortawesome/fontawesome-free/scss/regular';
@import '@fortawesome/fontawesome-free/scss/v4-shims';
2 respostas

Oi, Danilo, tudo bom?

Como você não tá usando webpacker você incluiu a pasta node_modules na asset pipeline? Você está usando o sprockets?

Se sim no seu asset.rb na pasta initializers você poderia fazer algo assim:

Rails.application.config.assets.paths << Rails.root.join('node_modules')

Aí depois seria dar os require como fez e testar se está tudo funcionando.

solução!

Olá Henrique, obrigado pelo retorno. Eu já tinha resolvido essa task, ainda sim, obrigado!