Import dynamic modules Using ( Webpacker 4 and Rails 6)

application.js

//app/javascript/packs/application.js

require("@rails/ujs").start()

import pageLoader from '../components/pageLoader';

(function() {
  window.pageLoader = pageLoader;
})();

Dashboard.js

//app/javascript//components/pages/Dashboard.js

export default class Dashboard {
  constructor(params){
    this.params = params;
    console.log('Hi, this is Dashboard class',params);
  }
};

pageLoader.js

//app/javascript/components/pageLoader.js

export default async function pageLoader(page, params) {
  const myModule = await import(`components/pages/${page}`);
  new myModule.default(params);
};

show.html.haml

//app/views/dashboards/show.html.haml

:ruby
  params = {
    id: 1,
    name: "Mai"
  }


= content_for :inline_javascript do
  :plain
    $(document).ready(function() {
      pageLoader('Dashboard', #{params});
    });