NPM Datatable Excel button not showing

Question

My Excel Button in datatable is now showing up. I'm using NPM to import all scripts, all others buttons works well (PDF, Copy, Print). Only Excel do not work.

Check my imports:

import 'datatables.net-bs'
import 'datatables.net-buttons-bs'
import 'datatables.net-responsive-bs'
import 'datatables.net-buttons/js/buttons.colVis.js'
import 'datatables.net-buttons/js/buttons.flash.js'
import 'jszip'
import pdfMake from 'pdfmake/build/pdfmake'
import pdfFonts from 'pdfmake/build/vfs_fonts'
import 'datatables.net-buttons/js/buttons.html5.js'
import 'datatables.net-buttons/js/buttons.print.js'

pdfMake.vfs = pdfFonts.pdfMake.vfs

My config:

let datatableConfig = {
    responsive: true,
    "dom": '<"html5buttons"B>lTfgtip',
    "buttons": [
        { extend: 'copy' },
        { extend: 'excel'}, 
        { extend: 'excelHtml5' },
        { extend: 'pdf'  },
        { extend: 'print' }
    ]
};

$('#dataTable').DataTable(datatableConfig)

If i put https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.4/jszip.min.js direct in my HTML, it works. How it do not work using import? (Yes, jszip is already installed)

Thanks!

Answer 1

I got the same issue with the require syntax and I had to do :

window.JSZip = require( "jszip" );

I don't know the syntax with import but maybe it's something like

import window.JSZip from 'jszip';

or

JSZip from 'jszip';

or

import JSZip from 'jszip';
window.JSZip = JSZip;