0

I have the LWC and I need download the folder with files in zip format. I found JSZip library.Downloaded this file (js). Added its to static resources and import its on my LWC and loaded this file used loadScript:

import JSZip from "@salesforce/resourceUrl/jszip"
...

async connectedCallback(){
        await loadScript(this, JSZip)
        .then(()=>{
            console.log('success load');
        })

But when i create a zip the system throws an error:

 async downloadFolder(event){
        const folder = event.detail;
        const zip = new JSZip();  <-- there is problem in this place!

!Uncaught (in promise)

Maybe somebody knows what the problem is...

Improve this question

1 Answer 1

Reset to default
2

You used the same name for the static resource file (JSZip) that the library itself wants to use (JSZip). Consider import JSZIP from '@salesforce/resourceUrl/jszip' instead, then use loadScript(this, JSZIP).

You could also choose to just make this into an ES6 module. Create a new LWC component named jszip. In that component, copy dist/jszip.min.js from the manual download option into lwc/jszip/jszip.js, and remove the html file. Now, add two lines at the end of this script:

const JSZip = window.JSZip;
export default JSZip;

This should allow you to import without using lightning/platformResourceLoader at all.

import JSZip from 'c/jszip';

This is a trick I've previously used to import the YouTube embedded player.

Improve this answer
5
  • Yes, you are wright. One more question: I have integration with Google Drive (by Named Cred) => i show GD files on my LWC. So, I want to have ability to download folder with files in zip. BUT: I haven`t blobs of these files. these files have only GD properties (name, id, links,parents,...) Do you have some ideas?
    – Nazar
    Commented Sep 1, 2023 at 12:34
  • @НазарЦихуляк To get the blobs, you use files.get. It's unclear at first glance if there's a batch mode one can leverage, but you'd start there; download each file, then you can use JSZip to compress the files to a single file.
    – sfdcfox ♦
    Commented Sep 1, 2023 at 14:34
  • but it doesn`t work async downloadFolder(event){ const folder = event.detail; let zip = new JSZip(); const content = await getFolderContent({folderId: folder.id}); const files = content.files; for(const file of files){ const upFile = await getFile({folderId:file.id}); zip.file(upFile.name, upFile); } zip.generateAsync({type: 'blob'}) .then((content)=>{ saveAs(content,folder.name +'.zip') }) .catch(() => { console.log('er); }); }
    – Nazar
    Commented Sep 4, 2023 at 7:52
  • When I tried to do this particular trick, it was giving me error that process.nextTick is not supported. Any way to bypass this ?
    – Somya Tiwari
    Commented Dec 6, 2023 at 3:33
  • @Nazar process.nextTick is a Node feature, and not available in browsers. Make sure you're grabbing a browser-compatible version, or you can try using browserify to convert your existing code into a bundle that should be browser compatible.
    – sfdcfox ♦
    Commented Dec 6, 2023 at 9:45

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .