strict mode code may not include a with statement

[lostmagicK]

Angular 8 I have this "strict mode code may not include a with statement" Error when i use this library in production. So i had to remove it completely.

[wnabil]

Please wait for the next version for Angular 8 support. its still WIP

[cbryant-zspace]

Seems like this might be an issue with html-docx-js which has 40 open issues and hasn't been updated in 3 years. Looks like no longer maintained.
Perhaps replace with jsdocx or docx.

Personally, don't care about exporting to docx just pdf and csv in Angular 8.

[lostmagicK]

Seems like this might be an issue with html-docx-js which has 40 open issues and hasn't been updated in 3 years. Looks like no longer maintained.
Perhaps replace with jsdocx or docx.

Personally, don't care about exporting to docx just pdf and csv in Angular 8.

I also dont want docx
Where can i change this?

[wnabil]

@cbryant-zspace thanks for the info, i will check this too

[Hareem123]

update for angular 7 and 8 is needed. How can I hide the table so that only the buttons are visible??

[lostmagicK]

update for angular 7 and 8 is needed. How can I hide the table so that only the buttons are visible??

use [hidden] property on your table

[davidct92]

I have the same problem, when are you going to deliver the next version for support Angular 8?

[wnabil]

@davidct92 Will try today Inshallah

[wnabil]

Kindly check version 1.3.0, it should be fixed
Waiting your confirmation @lostmagicK

[lostmagicK]

Kindly check version 1.3.0, it should be fixed
Waiting your confirmation @lostmagicK

now exportAsService.save() method is not working!
No error though

[wnabil]

Demo updated, the .save method now return an observable, please check readme.md

[lostmagicK]

Demo updated, the .save method now return an observable, please check readme.md

Yep got it just now..
Its working..
Let me check in production

[lostmagicK]

Demo updated, the .save method now return an observable, please check readme.md

Still same issue..
"strict mode code may not include a with statement"

[wnabil]

Which format is this and can you please create a repo for me so i can reproduce the issue?, i do not see it on my project

[lostmagicK]

When i use your library in production i see blank screen with console error. But not in local

[wnabil]

yes please create a minimal project on github so i can debug it, i do not use the normal angular 8 production build in my project and can not upgrade it now.

[wnabil]

@lostmagicK as i said, i do not see this issue on the demo project
Please upload me a project on github i can not reproduce the issue
npm install http-server -g

ng build --prod --aot

http-server dist/ngx-export-as-demo

[wnabil]

Any news about this guys please?

[lostmagicK]

Still facing that problem..
Project is running fine in debug but if i enable production im getting error

[wnabil]

Can you please generate a new demo project and try, if the problem happens again then please send me your system configurations and all the used tools with its version like npm, angular, angular cli and the OS too

[chenheng0910]

@wnabil :
I also had the same error.
I use the IONIC to generate a new demo, it's running well.
And then
npm install --save ngx-export-as
and import { ExportAsModule } from 'ngx-export-as';
and add ExportAsModule to my imports Array.
Then error come in my console:
Uncaught SyntaxError: Strict mode code may not include a with statement;
here is my dependencies:
"@angular/common": "~8.1.2", "@angular/compiler": "~8.1.2", "@angular/core": "~8.1.2", "@angular/forms": "~8.1.2", "@angular/platform-browser": "~8.1.2", "@angular/platform-browser-dynamic": "~8.1.2", "@angular/router": "~8.1.2", "@ionic-native/core": "^5.0.0", "@ionic-native/splash-screen": "^5.0.0", "@ionic-native/status-bar": "^5.0.0", "@ionic/angular": "^4.7.1", "@types/echarts": "^4.1.9", "core-js": "^2.5.4", "echarts": "^4.2.1", "ngx-export-as": "^1.3.0", "rxjs": "~6.5.1", "tslib": "^1.9.0", "zone.js": "~0.9.1"
npm version is 6.7.0, node version is 10.15.0.
Looking forward to your reply.

[chenheng0910]

I also clone your demo into my local and try to run it, but i failed when I execute the ng serve command:

ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/array' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/date' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/function' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/map' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/math' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/number' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/object' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/parse-float' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/parse-int' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/reflect' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/regexp' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/set' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/string' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/symbol' in '/Users/chenheng/myWork/ngx-export-as/src' ERROR in ./src/polyfills.ts Module not found: Error: Can't resolve 'core-js/es/weak-map' in '/Users/chenheng/myWork/ngx-export-as/src' ** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ ** ℹ ｢wdm｣: Failed to compile.

[lostmagicK]

Can you please generate a new demo project and try, if the problem happens again then please send me your system configurations and all the used tools with its version like npm, angular, angular cli and the OS too

Sorry for late response..

Error is occuring in angular v8.1, it was working fine in angular v7+. I have hosted in iis, npm 6.9.0, OS Windows 10 Home, Angular CLI 8.1.1 Node 10.16.0.

Note: its working fine in ng serve but when i do ng build and host it in server it is throwing error..

I will share project shortly..

[William-Paradis]

Hi,

I also get this error, but I only when I use the new Angular 8 differential loading feature.

Differential loading is a strategy where the CLI builds two separate bundles as part of your deployed application.
The first bundle contains modern ES2015 syntax, takes advantage of built-in support in modern browsers, ships less polyfills, and results in a smaller bundle size.
The second bundle contains code in the old ES5 syntax, along with all necessary polyfills. This results in a larger bundle size, but supports older browsers.
This strategy allows you to continue to build your web application to support multiple browsers, but only load the necessary code that the browser needs.

In my tsconfig.json, when I set the target version to "es5" and compile the application, I get no error.

However, when I set the target version to "es2015" to use diffrential loading and compile the application, I get the same error in Chrome's console:

Strict mode code may not include a with statement

To verify that the bug really came from your library, I removed it and everything worked just fine. You might be using old packages that es2015 doesn't support?

[wnabil]

Thanks for the info, i will look into all the imported libraries and check for possible solutions.

[dariosamban]

Is there any workarround for this issue that support es2015 config? or is there any update on the fix for this?

[wnabil]

currently no, i switched back to es5 for the moment but still need more time to implement the project using another lib, i can confirm the problem comes from html-docx-js

[benjibeaumont]

@wnabil This is a great little package. Had my angular app generating PDF's in a few minutes. Thanks for creating. I'm seeing the same error message as others when building for production:

Uncaught SyntaxError: Strict mode code may not include a with statement

It looks like it's restricted to Angular 8 and production mode. Have you been able to reproduce? If not, what can I do to help.. this is a fantastic little package and definitely worth resolving.

[benjibeaumont]

@wnabil This is a great little package. Had my angular app generating PDF's in a few minutes. Thanks for creating. I'm seeing the same error message as others when building for production:

Uncaught SyntaxError: Strict mode code may not include a with statement

It looks like it's restricted to Angular 8 and production mode. Have you been able to reproduce? If not, what can I do to help.. this is a fantastic little package and definitely worth resolving.

Heads up: I just removed all imports from DOCX in your package and my app builds in production fine now. So it's definitely the DOCX package that's the offending article.

[wnabil]

Thanks for the confirmation, yes i am trying to implement the docx using another library, any PR is welcome and can save a lot of time. Sorry for the delay guys but i am really busy currently
Hint: using es5 fix the problem if you do not really care about es2015 you can use it in tsconfig until we fix this issue

[iamade]

@benjibeaumont and @wnabil Please can you assist with the location of the DOCX package. i cant seem to locate it.

@wnabil I see that your package fetches the data from the css id. However, is it possible to pass a json data to your package instead so it fetches all the data being passed in the case where pagnation is used to filter the data on the html.

[wnabil]

@iamade https://github.com/wnabil/ngx-export-as/blob/master/projects/ngx-export-as/src/lib/export-as.service.ts

import * as htmlDocx from 'html-docx-js/dist/html-docx';

private getDOCX(config: ExportAsConfig): Observable<string | null> {
    return Observable.create((observer) => {
      const contentDocument: string = document.getElementById(config.elementId).outerHTML;
      const content = '<!DOCTYPE html>' + contentDocument;
      const converted = htmlDocx.asBlob(content, config.options);
      if (config.download) {
        this.downloadFromBlob(converted, config.fileName);
        observer.next();
        observer.complete();
      } else {
        const reader = new FileReader();
        reader.onloadend = () => {
          const base64data = reader.result;
          observer.next(base64data);
          observer.complete();
        };
        reader.readAsDataURL(converted);
      }
    });
  }

[RoWEN-FCUB]

Still getting the 'SyntaxError: strict mode code may not contain 'with' statements'. Hope it gets fix soon.

[wnabil]

Hi everyone, As a temp solution i am going to publish a new version without docx support. it will be a special version without html-docx-js library until i find a real fix for this issue or switch the implementation to another library

[Hareem123]

Hi, I am facing error in date formatting in csv and pdf is giving me empty data .

a6-11ea-840b-dbe4105ea458.png)

What could be the issue? Whereas my Datatable is showing the correct format .