feat(react): add options to opt out of calling applyPolyfills/defineCustomElements by default

[schadenn]

Hi again,

as we'd like to let the users of our components decide if and which polyfills they'd like to use, it would be great if we could make the applyPolyfills().then(() => defineCustomElements(window))-line optional/configurable.

I added 2 options to the reactOutputTarget noAutoPolyfills and noAutoRegister that will disable the corresponding function call.

[jagreehal]

Just hit an issue when working with a Gatsby project. This PR would help resolve issues where apps try to do SSR.

[bellindj]

@jagreehal were you able to get past the Gatsby SSR issue without this code being merged? I am trying to build my Gatsby app using the React version of my Stencil library and getting ReferenceError: window is not defined because it is trying to run loader.mjs during build.

[jagreehal]

@bellindj I'll upload my repo but Gatsby SSR isn't going to work because replaceRenderer isn't async, and don't think it ever will be see gatsbyjs/gatsby#2423

[bellindj]

@jagreehal thanks! I was able to get this to work in my Gatsby site as is by using the react-loadable package.

I created a new file (dynamic-components.js) in Gatsby with an import for each one of my components:

import Loadable from "react-loadable"
import React from "react"

const loadingComponent = <div>Loading</div>

export const MyButton = Loadable({
  loader: () =>
    import("my-web-react/dist").then(module => module.MyButton),
  loading() {
    return loadingComponent
  },
})

export const MyTabs = Loadable({
  loader: () =>
    import("my-web-react/dist").then(module => module.MyTabs),
  loading() {
    return loadingComponent
  },
})

Then inside my Gatsby components, import from the dynamic components file:
import { MyButton } from "src/utilities/dynamic-components"

This passes SSR for Gatsby and I am off and rolling using my new React lib wrapping my Stencil web components!

[ediabal]

@bellindj with react-loadable are you able to actually render these components with ssr? TIA!

[bellindj]

@ediabal Yes with react-loadable we were able to load our StencilJS components in our Gatsby site. Unfortunately react-loadable broke our site in IE11/Edge so we decided to strip out Gatsby and just use pure React. With pure React there is no need to react-loadable since it doesn't use SSR out of the box.

[jthoms1]

This PR is a bit out of date now. Appologizes for not reviewing earlier. I get the gist of it to allow for more configuration to the loading process for polyfills and autoloading which I agree with. I will likely open another PR to fix and reference this one.

[jthoms1]

This was completed in another PR #62.