JSFiddle - React, Tailwind, and code Playground

HTML

<html>
  
  <head>

  <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
    <link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
 
 <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.8.4/moment.min.js"></script>
 
 <script src="https://cdn.datatables.net/plug-ins/1.10.19/sorting/datetime-moment.js"></script>
  </head>
  
  <body>
    <table id="main">
      
      <thead class="tb_cabecalho">
        <th>DT-COMPRA</th>
        <th>QTDE</th>
      </thead>

      <tbody>                    
        <tr>
          <td>02/10/2016</td>
          <td>100</td>
        </tr>
        <tr>
          <td>28/08/2016</td>
          <td>100</td>
        </tr>
         <tr>
          <td>02/08/2015</td>
          <td>100</td>
        </tr>
         <tr>
          <td>02/01/2017</td>
          <td>100</td>
        </tr>
      </tbody>
    </table>

</body>
  
  
</html>

JavaScript

$(document).ready(function() {
$.fn.dataTable.moment( 'DD/MM/YYYY' );
        $('#main').dataTable(                           
            {
            	lengthMenu: [[100, -1], [100, "Todos"]]
        		},
            {
                columnDefs: [{
                targets: 0
                }]
            }            
        );
    });