Import @apollo/client/utilities/globals wherever __DEV__ is used

[benjamn]

I hoped PR #8689 would put a stop to ReferenceError: __DEV__ is not defined errors, but issue #8674 demonstrates it's not enough to import the polyfill in entry point @apollo/client/**/index.js modules, because that still allows some bundlers to tree-shake or reorder dependencies in a way that leads to __DEV__ being used before it has been polyfilled.

This PR turns the src/utilities/globals/ directory into a new nested entry point, @apollo/client/utilities/globals, which can be imported by itself (independently from the rest of @apollo/client/utilities), and polyfills __DEV__ the first time it's imported. This module now gets imported in every module that uses __DEV__, rather than just at the entry points. Although this is a bit of a chore, it seems to be more robust, and it's programmatically enforced at build time. Also, @apollo/client/utilities/globals/package.json explicitly says "sideEffects": true, which should hopefully be a clear signal to tree-shaking bundlers to leave this code intact.

I threw out the config/checkDEV.ts script and instead put the enforcement logic in config/resolveModuleIds.ts, since it's already responsible for parsing files and resolving the modules identifiers they import. Specifically, this logic enforces that any dist/**/*.js file that ends up using __DEV__ also imports the @apollo/client/utilities/globals entry point (typically using a relative path like ../../utilities/globals).

Fixed issues:

• ReferenceError: __DEV__ is not defined after update to 3.4.5 with Next.js app #8674 (comment)

[benjamn]

I can confirm this PR fixes the reproduction in #8674.

[benjamn]

I turned the functions in this file into a utility Transformer class so we can collect absolutePaths more easily (in the normalizeId method). All the existing logic should otherwise be the same.

[roderik]

Are you sure this works as expected? I get errors since upgrading to .10 in the persisted queries package. .9 works without issues

[benjamn]

@roderik The checkDEV function is no longer called as a function anywhere in the published code of @apollo/client@3.4.10 (which includes @apollo/client/link/persisted-queries), so I would guess you might want to clear your webpack disk cache and rebuild, or something along those lines?

[shevchenkonik]

Hey folks, I would like to say that this version isn't compatible with IE11 as opposed to 3.4.8.

I see in my production build using const & let and this one is issue (3.4.10) :

const safeGlobal = (
  maybe(function() { return globalThis }) ||
  maybe(function() { return window }) ||
  maybe(function() { return self }) ||
  maybe(function() { return global }) ||
  maybe(function() { return Function("return this")() })
);

let needToRemove = false;

instead of 3.4.8:

var safeGlobal = (
  maybe(function() { return globalThis }) ||
  maybe(function() { return window }) ||
  maybe(function() { return self }) ||
  maybe(function() { return global }) ||
  maybe(function() { return Function("return this")() })
);

var needToRemove = false;

[benjamn]

@shevchenkonik Thanks for that PR! Fixed in ts-invariant@0.9.2.