TypeError: Cannot read property 'toLowerCase' of undefined with commerce.js

Question

I have been trying to solve this error with several ways, since other people had similar outputs, but still couldn't do it completely.

I am creating an e-commerce site integrating commerce.js, after importing from '@chec/commerce.js' I had a warning (VS):

Could not find a declaration file for module '@chec/commerce.js'. '/Users/e-commerce/node_modules/@chec/commerce.js/lib/index.js' implicitly has an 'any' type.
  Try `npm install @types/chec__commerce.js` if it exists or add a new declaration (.d.ts) file containing `declare module '@chec/commerce.js';`ts(7016)

Whenever I fired the localhost, as I was expecting, I saw a related error message, not exactly the same though (will reproduce it below).
Therefore my thought was: fixing the error message in VS, will most likely fix this one as well. I manage to solve the warning by adding the new declaration file (because it seems that the package mentioned there doesn't exist yet) So, I thought it was that, then I fired the server and the output is exactly the same as before.

TypeError: Cannot read property 'toLowerCase' of undefined
new e
node_modules/@chec/commerce.js/lib/index.js:1

Now, apparently is the first line of the file index.js in node_modules. Ok, what does it say then? (I will write here more than only the first line, just in case)

    var _objectWithoutProperties=require("@babel/runtime/helpers/objectWithoutProperties"),_toConsumableArray=require("@babel/runtime/helpers/toConsumableArray"),_typeof=require("@babel/runtime/helpers/typeof"),_defineProperty=require("@babel/runtime/helpers/defineProperty"),_classCallCheck=require("@babel/runtime/helpers/classCallCheck"),_createClass=require("@babel/runtime/helpers/createClass"),_regeneratorRuntime=require("@babel/runtime/regenerator"),_asyncToGenerator=require("@babel/runtime/helpers/asyncToGenerator"),axios=require("axios");function _interopDefaultLegacy(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}

But this is not the only one, below, another one complaining about the commerce module still

Module.<anonymous>
src/lib/commerce.js:4
  1 | // @ts-ignore
  2 | import Commerce from "@chec/commerce.js";
  3 | 
> 4 | export const commerce = new Commerce(
  5 |   process.env.REACT_APP_CHEC_PUBLIC_KEY,
  6 |   true
  7 | );

Well, now I am a bit confused about the error messages that I still see, and therefore would like to hear what do you think it could be the problem?

I check some posts here as well, such as Typescript react - Could not find a declaration file for module ''react-materialize'. 'path/to/module-name.js' implicitly has an any type and related
By the way, I am not using typescript.

Thank you in advance.

Answer 1

I had the exact same error, it went away as soon as I moved the.env file outside the src/ folder. Not using TypeScript either.

Answer 2

Here are some quick steps that should proly help:

• Go the /src folder
• And create this file chec-commerce.d.ts
  The d tells TypeScript that this is a declaration script.
• Inside the just created file, write this:

declare module '@chec/commerce';

Based on how you are importing the module, this should clear all the errors.
Kindly confirm.

Answer 3

Replace this:

export const commerce = new Commerce(process.env.REACT_APP_CHEC_PUBLIC_KEY, true);

with

export const commerce = new Commerce('PUBLIC_API_KEY', true);

I couldn't fix it any other way.

Answer 4

.env file should outside the src folder and its work for me its will also work for you too...