Search code examples
reactjstypescripteslintapollonext.js

File/Blob - eslint(no-undef)


While creating an Apollo Client in a NextJS/TypeScript project, I need to figure out whether the current operation is Upload or not, but ESLint complains that File and Blob are not defined.

I can disable warning: // eslint-disable-next-line no-undef but I’d like to understand why there’s such warning and I’d like to fix it without ignoring if possible.

const isFile = (value: any): boolean => {
  if (isPlainObject(value) || Array.isArray(value)) {
    return Object.values(value).map(isFile).includes(true)
  }
  const isfile = typeof File !== 'undefined' && value instanceof File
  const isblob = typeof Blob !== 'undefined' && value instanceof Blob
  return isfile || isblob
}
const isUpload = ({ variables }: any) => {
  return Object.values(variables).some(isFile)
}

enter image description here


Solution

  • You can add browser: true to your ESLint config file inside the env prop:

    // .eslintrc
    {
      "env": {
        "browser": true
      }
    }