JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.8/css/jquery.dataTables.min.css">
<script src="https://cdn.datatables.net/1.10.8/js/jquery.dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.0.1/css/buttons.dataTables.min.css">
<script src="https://cdn.datatables.net/buttons/1.2.2/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js"></script>
<table id="numberWithLeading0">
  <thead>
    <tr>
      <th>Carrier Code</th>
      <th>Flight</th>
      <th>Arrival Date</th>
      <th>Shipment</th>
      <th>Site</th>
      <th>Error Code</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td> 5X</td>
      <td> 017 </td>
      <td> 2016-08-11</td>
      <td>AT2510MFHD7</td>
      <td>04196</td>
      <td>003</td>
    </tr>
    <tr>
      <td> 5X</td>
      <td> 018 </td>
      <td> 2016-08-11</td>
      <td>AT2510MFHD7</td>
      <td>04196</td>
      <td>019</td>
    </tr>
  </tbody>
</table>

JavaScript

var table = $('#numberWithLeading0').DataTable({
  dom: 'Bfrtlip',

  buttons: [{
    extend: 'excelHtml5',
    exportOptions: {
      orthogonal: 'sort'
    }
  }, {
    extend: 'csvHtml5',
    text: 'CSV',
    exportOptions: {
      orthogonal: 'sort'
    }
  }],
  columnDefs: [{
    targets: [1,4,5], // Retain leading zeros for Flight, Site and Error Code.
    render: function(data, type, row, meta) {
      if (type === 'sort') {
        return "\u200C" + data;
      }

      return data;

    }
  }]
});