Zip.js function does not work on a angular implementation of the project

yusefrich commented 4 years ago

Hi guys, the zip function inside zip.js does not work in a angular implementation of this package, it returns the following error:

MeusMapasDetailComponent.html:497 ERROR ReferenceError: process is not defined
    at push../node_modules/shp-write/src/zip.js.module.exports (zip.js:33)
    at Object.push../node_modules/shp-write/src/download.js.module.exports [as download] (download.js:4)
    at MeusMapasDetailComponent.push../src/app/cliente-basico/modules/meus-mapas/detail/detail.component.ts.MeusMapasDetailComponent.exportshp (detail.component.ts:908)
    at Object.eval [as handleEvent] (MeusMapasDetailComponent.html:497)
    at handleEvent (core.js:23107)
    at callWithDebugContext (core.js:24177)
    at Object.debugHandleEvent [as handleEvent] (core.js:23904)
    at dispatchEvent (core.js:20556)
    at core.js:21003
    at HTMLButtonElement.<anonymous> (platform-browser.js:993)

My current implementation

import * as shp from 'shp-write';

  getSingleGeoJson(){
    var selectedPoligon = this.allDrawnItems.getLayer(this.ultimoPoligonoSelecionado.target._leaflet_id);

    var newPoli = L.polygon(selectedPoligon["_latlngs"][0],
      {
        color: '#1DB954',
        fillColor: '#1DB954',
        fillOpacity: 0.2
      }
    ).addTo(this.singlePolygonGroupLayer);

    return this.singlePolygonGroupLayer.toGeoJSON();

  }

  exportshp() {
     var options = {
       folder: 'myshapes',
       types: {
           point: 'mypoints',
           polygon: 'mypolygons',
           line: 'mylines'
       }
  }
      shp.download(this.getSingleGeoJson(), options); 
  }

What i found out

After messing arround i found that the error is in line 33 of the zip.js file inside src, where is has:

 if (!process.browser) {
      generateOptions.type = 'nodebuffer';
    }

since theres no process being set, because the method is being called by a angular project, the download does not happens.

younghoh commented 4 years ago

workaround add pollyfills.ts

(window as any).process = {
    browser: true
};

or

download https://unpkg.com/shp-write@latest/shpwrite.js

apply https://github.com/mapbox/shp-write/issues/48#issuecomment-308412452

add angular.json

            "scripts": [
              "your_shpwrite_path",
            ]

in your component or service

declare var shpwrite: any;
...
...
shpwrite.download()

wondie commented 4 years ago

Is there any fix for the browser version?

mapbox / shp-write

Zip.js function does not work on a angular implementation of the project #77

My current implementation

What i found out