ng-pdf-make icon indicating copy to clipboard operation
ng-pdf-make copied to clipboard

Unable to import module

Open christofferskog opened this issue 8 years ago • 10 comments

Trying to import the module but it only throws this error:

Error encountered resolving symbol values statically. Calling function 'makeDecorator', function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol NgModule.

I'm not sure what else to try.. Just did what your docs told me to do.

christofferskog avatar Jul 07 '17 07:07 christofferskog

I got this same error. I studied the repo a little bit and was able to figure out how you can use the native pdfmake js library.

I am using Angular 4.2.6 + Angular CLI 1.2.1

Install pdfmake: npm install pdfmake --save

Add the pdfmake and fonts js files to the scripts section of the .angular-cli.json: "../node_modules/pdfmake/build/pdfmake.min.js", "../node_modules/pdfmake/build/vfs_fonts.js"

At the top of your component or service, add this line: declare const pdfMake;

Use pdfmake like normal: const docDefinition = { content: 'This is an sample PDF printed with pdfMake' }; pdfMake.createPdf(docDefinition).open();

nkyordy avatar Jul 13 '17 20:07 nkyordy

If we can use the native library as is , then why do we have this ng module ??

yajnasteju avatar Dec 01 '17 08:12 yajnasteju

@nkyordy hi, I'm just staring with angular so it's still unclear to me how I should implement your walk-around -should I still add "PdfmakeModule " in my appmodule? (cause that direcly gives me the same error anyway) .

  • "declare const pdfMake" does nothing -do You maybe mean "import * as pdfMake from 'ng-pdf-make'"?:S (declare const pdfMake in my component does not reffer to an Object so it's pointless- what am I missing here?)

neo-xy avatar Jan 29 '18 09:01 neo-xy

How to solve this importing issue? Any updates?

oomz avatar Feb 05 '18 04:02 oomz

@oomz nope -got nothing from no one :/ and too busy to look deeper into it (so I just runings all the time with warnings )- if You will find any good solution I would be greatfull if U could let me know:)

neo-xy avatar Feb 05 '18 12:02 neo-xy

i had the same issue which was fixed by adding those lines to my tsconfig.json


"paths": {
      "@angular/*": [
        "../node_modules/@angular/*"
      ]
    }

Credits go to: https://stackoverflow.com/questions/43815410/error-in-error-encountered-resolving-symbol-values-statically-calling-function

jwiesmann avatar Feb 15 '18 09:02 jwiesmann

@neo-xy Apologies, I've been using my GitLab account and not been checking GitHub lately.

No, you do not need to import this module. Importing the module enables TypeScript to perform code inspections and also allows the Angular CLI to identify errors before compiling your code into JavaScript. My workaround is a bit dirty in that regard, because it imports the PDFMake library directly to be used in the DOM at run-time.

I am essentially using PDFMake the same way that I would use it in a vanilla JS app. Adding:

"../node_modules/pdfmake/build/pdfmake.min.js", "../node_modules/pdfmake/build/vfs_fonts.js"

to the scripts object in angular-cli.json is like importing them directly in a script tag:

<script type="javascript" src="/pdfmake/build/pdfmake.min.js"> <script type="javascript" src="/pdfmake/build/vfs_fonts.js">

In vanilla JS, I could then call PDFMake directly by referencing the pdfMake library imported by the script tags. Angular code is written in TS, however, which means that you need to tell it where your variable is coming from. Typically you wrap the library in a TS file that exports a "PdfmakeModule" (which is what this library attempts to do). Instead, I just added:

declare const pdfMake;

to the top of the component I was working with, which tells the compiler, "Trust me, this will be here when you need it". The downside of this approach is that you cannot perform code inspections and debugging is more difficult (essentially all of the benefits of using TS in the first place). The upside is it works and you do not need to build a TS module.

I hope that answers your question. If you have any follow up questions, hit me up, I'll check this thread more often.

@yajnasteju this ^

nkyordy avatar Mar 11 '18 17:03 nkyordy

@nkyordy thank you that You took time to answer -will try your approach in couple of days(stacked with android a.t.m:) ) thank you again (Y)

neo-xy avatar Mar 12 '18 08:03 neo-xy

I have same issue as mentioned previously.

"declare const pdfMake" does nothing -do You maybe mean "import * as pdfMake from 'ng-pdf-make'"?

ERROR ReferenceError: pdfMake is not defined.

jmaheshTrimble avatar Mar 12 '18 09:03 jmaheshTrimble

@neo-xy @jmaheshTrimble If you are still having issues, create a repo with an example and I'll take a look at it.

nkyordy avatar Apr 06 '18 22:04 nkyordy