Not compatible with NextJs and React

[angeligareta]

When I try add the package to my project with nextjs and react I recieved the following error after start:

Location: "/mnt/c/Users/Angel Igareta/Desktop/AteCloud/ecommerce/packages/shop/babel.config.js" error - /mnt/c/Users/Angel Igareta/Desktop/AteCloud/ecommerce/node_modules/easyinvoice/dist/easyinvoice.js Module not found: Can't resolve 'fs' in '/mnt/c/Users/Angel Igareta/Desktop/AteCloud/ecommerce/node_modules/easyinvoice/dist'

[dveldhoen]

Hi! Thanks for contacting us. This error should not occur indeed. Please give us some time to fix this. Shouldn’t take more than about 24 hours.

[dveldhoen]

Hi! The problem should be fixed now (version 1.0.95). Please note pdfjs dependency was causing this issue, so rather than building it into our package we made it a peer dependency. In order to use the 'render()' function you will have to install the peer dependency yourself or include pdfjs 2.3.200 using a cdn. Please see the the readme for this.

Could you let us know if this fixed your problem? If you experience any other issues, please let us know. Thank you!

[angeligareta]

Hi, I have tried it and it work fine if you move is-base64 and axios dependencies from devDependencies to dependencies to have them installed when adding the package to the project. Thank you very much for your efficiency and support and good luck with the project!

[dveldhoen]

Hi, we deliberately choose to include axios and is-base64 within the build js file so it can easily be required through CDN. It should also work for you without installing those dependencies yourself. So the build failed because of these packages?

[angeligareta]

It did not, the project required those packages in order to run easyinvoice package. As they are used in production, they should be included in dependencies.

[dveldhoen]

That doesn't really make sense though. Because that would mean that these examples shouldn't work, but they do: https://jsfiddle.net/easyinvoice/qfs8dk0p/

Only the easyinvoice.min.js is being required there.

[angeligareta]

Yes, but I did not include the CDN, packages in react should be managed with package json

[dveldhoen]

Agreed, but then still the library should work by just importing the library like so: import easyinvoice from 'easyinvoice'; I have a working example on my local without those packages installed.

Like I said, axios and is-base64 are build within the easyinvoice.min.js

Still, I'll start a small investigation on my local again. See if I missed something.

[dveldhoen]

Seems to work fine here. My steps:

1. I just created a clean React project
2. Ran 'npm install easyinvoice'
3. Added import easyinvoice from 'easyinvoice'; to the default page
4. Added two lines of code to run on page load const result = await easyinvoice.createInvoice({}) and console.log(result.pdf);
5. Built the project
6. Put the build output on our dev server
7. Opened the page in the browser. Gave me a successful result straight away. A nice base64 string.

Axios and is-base64 are nowhere to be found in node_modules folder. So it seems there is no need to put them in dependencies.

[angeligareta]

I think that is because of npm, if you use yarn it only adds the production dependencies, try using yarn add instead.

[dveldhoen]

I will try, give me a sec

[dveldhoen]

I repeated above steps. Only changed npm install to yarn add easyinvoice. No Axios or is-base64 in node_modules. Ran fine locally and after building on the dev server.

[angeligareta]

That's odd because on my next + react + ts project I could not make it work without adding them as dependencies.

I leave the error here just in case it helps:

error - Error: Cannot find module 'axios' Require stack:

• /home/angeligareta/Desktop/X/ecommerce/node_modules/easyinvoice/index.js
• /home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/load-components.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/api-utils.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/next-server.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/server/next.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/server/lib/start-server.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/cli/next-dev.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/bin/next at Function.Module._resolveFilename (internal/modules/cjs/loader.js:966:15) at Function.Module._load (internal/modules/cjs/loader.js:842:27) at Module.require (internal/modules/cjs/loader.js:1026:19) at require (internal/modules/cjs/helpers.js:72:18) at Object. (/home/angeligareta/Desktop/X/ecommerce/node_modules/easyinvoice/index.js:1:13) at Module._compile (internal/modules/cjs/loader.js:1138:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10) at Module.load (internal/modules/cjs/loader.js:986:32) at Function.Module._load (internal/modules/cjs/loader.js:879:14) at Module.require (internal/modules/cjs/loader.js:1026:19) at require (internal/modules/cjs/helpers.js:72:18) at Object.easyinvoice (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:21059:18) at webpack_require (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:29:31) at Module../utils/order.ts (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:20714:69) at webpack_require (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:29:31) at Module../utils/index.ts (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:20679:65) { code: 'MODULE_NOT_FOUND', requireStack: [ '/home/angeligareta/Desktop/X/ecommerce/node_modules/easyinvoice/index.js', '/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/load-components.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/api-utils.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/next-server.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/server/next.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/server/lib/start-server.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/cli/next-dev.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/bin/next' ] } Error: Cannot find module 'axios' Require stack:
• /home/angeligareta/Desktop/X/ecommerce/node_modules/easyinvoice/index.js
• /home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/load-components.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/api-utils.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/next-server.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/server/next.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/server/lib/start-server.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/cli/next-dev.js
• /home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/bin/next at Function.Module._resolveFilename (internal/modules/cjs/loader.js:966:15) at Function.Module._load (internal/modules/cjs/loader.js:842:27) at Module.require (internal/modules/cjs/loader.js:1026:19) at require (internal/modules/cjs/helpers.js:72:18) at Object. (/home/angeligareta/Desktop/X/ecommerce/node_modules/easyinvoice/index.js:1:13) at Module._compile (internal/modules/cjs/loader.js:1138:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10) at Module.load (internal/modules/cjs/loader.js:986:32) at Function.Module._load (internal/modules/cjs/loader.js:879:14) at Module.require (internal/modules/cjs/loader.js:1026:19) at require (internal/modules/cjs/helpers.js:72:18) at Object.easyinvoice (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:21059:18) at webpack_require (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:29:31) at Module../utils/order.ts (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:20714:69) at webpack_require (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:29:31) at Module../utils/index.ts (/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js:20679:65) { code: 'MODULE_NOT_FOUND', requireStack: [ '/home/angeligareta/Desktop/X/ecommerce/node_modules/easyinvoice/index.js', '/home/angeligareta/Desktop/X/ecommerce/packages/shop/.next/server/static/development/pages/_app.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/load-components.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/api-utils.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/next-server/server/next-server.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/server/next.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/server/lib/start-server.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/cli/next-dev.js', '/home/angeligareta/Desktop/X/ecommerce/node_modules/next/dist/bin/next' ] }

[dveldhoen]

Thanks! Perhaps in some cases the packages are required for a successfull build even though they are not really needed because of some framework/build lookup functionality. I'll just add them to the basic dependencies for now to prevent your and maybe others build errors. Will dive into it in the near future.

[dveldhoen]

Alright, changes are pushed. Could you let me know if your errors are fixed in version 1.0.100? The changes are being published now. Should take a few minutes.

[angeligareta]

It works perfect now, thank you very much!

[angeligareta]

Hello,

I was revising the code and I see the invoices are being generated at https://www.easyinvoice.cloud/. I see that for calling that api you need an authorization header, but I have not included any api key. Which one is it being used? Is the 30 day trial that I can see at https://factuursimpel.nl/? On top of that I wanted to know if that information is being stored or is just used to generate the invoice. I would like to use this for customers and I could not trust a source storing that sensible information.

Thank you

[dveldhoen]

Hi, the invoice generation part of this package (without storing capabalities) will be free forever. Also your data will not be stored while using the free version. When including an apiKey (which our NPM package not yet supports) your invoices will be stored and you will be provided a GUI. This will cost 10 dollars a month.

So in conclusion. The endpoint you are using right now will remain free and data will not be stored. Also we guarantee a 99,99% uptime of the api.

[angeligareta]

Hi, thanks for the response, but I would need a guarantee of how this data is being stored and used. I see you started the project a month ago and for this time the project is great, but I want to use this in production and I have the risk of using an external service only for generating invoices that could be attacked. Because of this, we have decided to use an offline library, I just wanted to transmit my feedback. Thanks for everything and good luck with the project.

[angeligareta]

On top of that, I recommend adding in the README.md that the data is being generated in the cloud, so it is an online library. Regards

[dveldhoen]

We understand completely, thanks for the feedback and good luck with your project!