Legacy browser support

Reactive Data Client is designed to work out of the box with most tooling.

If you see, Uncaught TypeError: Class constructor Resource cannot be invoked without 'new' this is most likely due to targeting Internet Explorer support with a custom webpack configuration. This will occur even when using a modern browser, so long as your target (typically set with browserslist) includes legacy browsers like Internet Explorer.

In this case, follow the instructions below to ensure compatibility.

Transpile packages

Adding webpack-plugin-modern-npm will ensure compatibility of all installed packages with legacy browsers.

NPM

yarn add --dev webpack-plugin-modern-npm

Yarn

npm install --saveDev  webpack-plugin-modern-npm

esm.sh

<script type="module">
  import * from 'https://esm.sh/webpack-plugin-modern-npm?dev';
</script>

Then install the plugin by adding to webpack config.

webpack.config.js

const ModernNpmPlugin = require('webpack-plugin-modern-npm');

module.exports = {
  plugins: [
    new ModernNpmPlugin()
  ]
};

Polyfills

Use CRA polyfill or follow instructions below.

NPM

yarn add core-js whatwg-fetch

Yarn

npm install --save core-js whatwg-fetch

esm.sh

<script type="module">
  import * from 'https://esm.sh/core-js';
  import * from 'https://esm.sh/whatwg-fetch';
</script>

index.tsx

import 'core-js/stable';
import 'whatwg-fetch';
// place the above line at top