lahmatiy/react-render-tracker

Using via `import` / `require()`

Opened this issue · 3 comments

It would be really convenient if the connection to the tracker can be initiated via an npm package import instead of a script tag (similarly to how react-devtools does it).

I'm trying to optimize a program running in an iframe and this would be perfect for that.

import 'react-render-tracker';
import React from 'react';
...
fnpen commented

Solution:

Rename index entry file to bootstrap and put it to new index file:

if (process.env.NODE_ENV === 'production') {
  require('./bootstrap');
} else {
  (() => {
    const script = document.createElement('script');
    script.type = 'text/javascript';
    script.defer = false;
    script.src = 'https://cdn.jsdelivr.net/npm/react-render-tracker';
    script.onload = () => require('./bootstrap');

    document.head.appendChild(script);
  })();
}

It will be loaded before the 'react-dom' module, it's a temporary, but working solution to use it without access to HTML markup.

I consider that's a required functionality in some cases. It can't be polyfilled in some cases / scenarios, e.g. for React Native support (#11). I'm going to add such a functionality. I can't say ETA for sure, but maybe in next 1-2 months.

For a clarification, it's not about NPM availability (it's available) but about issues related to using (injecting) with require / import.