table dragger a webpack

app/assets/javascripts/application.js

@@ -1,6 +1,5 @@
 //= require rails-ujs
 //= require turbolinks
 //= require input-tag/input-tag.js
-//= require table-dragger/dist/table-dragger
 //= require zepto/dist/zepto.min.js
 //= require_tree .

app/assets/javascripts/order.js

@@ -1,14 +0,0 @@
-$(document).on('turbolinks:load', function() {
-  var table = document.querySelector('.table-draggable');
-
-  if (table == null) return;
-
-  tableDragger(table, {
-    mode: 'row',
-    onlyBody: true,
-    dragHandler: '.handle'
-  }).on('drop', function(from, to, el, mode) {
-    $('.reorder').val(function(i,v) { return i; });
-    $('.submit-reorder').removeClass('d-none');
-  });
-});

app/javascript/packs/application.js

@@ -17,3 +17,19 @@
 
 require("trix")
 require("@rails/actiontext")
+import tableDragger from 'table-dragger'
+
+document.addEventListener('turbolinks:load', () => {
+  const table = document.querySelector('.table-draggable');
+
+  if (table == null) return;
+
+  tableDragger(table, {
+    mode: 'row',
+    onlyBody: true,
+    dragHandler: '.handle'
+  }).on('drop', (from, to, el, mode) => {
+    $('.reorder').val((i,v) => i);
+    $('.submit-reorder').removeClass('d-none');
+  });
+})