react#StrictMode TypeScript Examples

The following examples show how to use react#StrictMode. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: index.tsx    From OpenBA-NextGenTV with MIT License 7 votes vote down vote up 
ReactDOM.render(
  <ErrorBoundaryWS>
    <StrictMode>
      <Provider store={store}>
        <PersistGate loading={null} persistor={persistor}>
          <App />
        </PersistGate>
      </Provider>
    </StrictMode>
  </ErrorBoundaryWS>,
  document.getElementById('root')
);
Example #2
Source File: Render.tsx    From reskript with MIT License 6 votes vote down vote up 
render() {
        const {error} = this.state;
        const {target: Component} = this.props;

        if (error) {
            return <pre style={{color: 'red'}}>{error}</pre>;
        }

        return (
            <StrictMode>
                <Component />
            </StrictMode>
        );
    }
Example #3
Source File: index.tsx    From pancake-swap-testnet with MIT License 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <Providers>
      <>
        <ListsUpdater />
        <ApplicationUpdater />
        <TransactionUpdater />
        <MulticallUpdater />
        <ToastListener />
      </>
      <ResetCSS />
      <GlobalStyle />
      <App />
    </Providers>
  </StrictMode>,
  document.getElementById('root')
)
Example #4
Source File: index.tsx    From pancake-swap-exchange-testnet with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <Providers>
      <>
        <ListsUpdater />
        <ApplicationUpdater />
        <TransactionUpdater />
        <MulticallUpdater />
        <ToastListener />
      </>
      <ResetCSS />
      <GlobalStyle />
      <App />
    </Providers>
  </StrictMode>,
  document.getElementById('root')
)
Example #5
Source File: index.tsx    From mozartfinance-swap-interface with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <Providers>
      <>
        <ListsUpdater />
        <ApplicationUpdater />
        <TransactionUpdater />
        <MulticallUpdater />
        <ToastListener />
      </>
      <ResetCSS />
      <GlobalStyle />
      <App />
    </Providers>
  </StrictMode>,
  document.getElementById('root')
)
Example #6
Source File: index.tsx    From meshtastic-web with GNU General Public License v3.0 6 votes vote down vote up 
root.render(
  <StrictMode>
    <ErrorBoundary FallbackComponent={ErrorFallback}>
      <RouteProvider>
        <Provider store={store}>
          <LazyMotion features={domAnimation}>
            <App />
          </LazyMotion>
          <ReloadPrompt />
        </Provider>
      </RouteProvider>
    </ErrorBoundary>
  </StrictMode>,
);
Example #7
Source File: index.tsx    From TabMerger with GNU General Public License v3.0 6 votes vote down vote up 
render(
  <StrictMode>
    <Provider store={store}>
      <ThemeWrapper>
        <App />
      </ThemeWrapper>
    </Provider>
  </StrictMode>,
  document.getElementById("root")
);
Example #8
Source File: index.tsx    From skeleton-web3-interface with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <FixedGlobalStyle />
    <Web3ReactProvider getLibrary={getLibrary}>
      <Web3ProviderNetwork getLibrary={getLibrary}>
        <Provider store={store}>
          <Updaters />
          <ThemeProvider>
            <ThemedGlobalStyle />
            <HashRouter>
              <App />
            </HashRouter>
          </ThemeProvider>
        </Provider>
      </Web3ProviderNetwork>
    </Web3ReactProvider>
  </StrictMode>,
  document.getElementById('root')
)
Example #9
Source File: index.tsx    From goose-frontend-amm with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <Providers>
      <>
        <ListsUpdater />
        <ApplicationUpdater />
        <TransactionUpdater />
        <MulticallUpdater />
      </>
      <ResetCSS />
      <GlobalStyle />
      <App />
    </Providers>
  </StrictMode>,
  document.getElementById('root')
)
Example #10
Source File: index.tsx    From excalideck with MIT License 6 votes vote down vote up 
async function init() {
    const initialDeck = await InitialDeck.get(config.isHomepage);
    ReactDOM.render(
        <StrictMode>
            <PersistentExcalideckEditor
                initialDeck={initialDeck}
                saveToLocalStorage={!config.isHomepage}
            />
            {config.isHomepage ? <CTABanner /> : null}
        </StrictMode>,
        document.getElementById("root")
    );

    if (!config.isHomepage) {
        registerServiceWorker(config.serviceWorkerScope);
    }
}
Example #11
Source File: index.tsx    From panther-frontend-dex with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <Providers>
      <>
        <ListsUpdater />
        <ApplicationUpdater />
        <TransactionUpdater />
        <MulticallUpdater />
      </>
      <ResetCSS />
      <GlobalStyle />
      <App />
    </Providers>
  </StrictMode>,
  document.getElementById('root')
)
Example #12
Source File: index.tsx    From reskript with MIT License 6 votes vote down vote up 
mount = async () => {
    const root = document.getElementById('root')!;
    render(
        <StrictMode>
            <App />
        </StrictMode>,
        root.appendChild(document.createElement('div'))
    );
}
Example #13
Source File: index.tsx    From dyp with Do What The F*ck You Want To Public License 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <FixedGlobalStyle />
    <Web3ReactProvider getLibrary={getLibrary}>
      <Web3ProviderNetwork getLibrary={getLibrary}>
        <Provider store={store}>
          <Updaters />
          <ThemeProvider>
            <ThemedGlobalStyle />
            <HashRouter>
              <App />
            </HashRouter>
          </ThemeProvider>
        </Provider>
      </Web3ProviderNetwork>
    </Web3ReactProvider>
  </StrictMode>,
  document.getElementById('root')
)
Example #14
Source File: index.tsx    From gonear-name with The Unlicense 6 votes vote down vote up 
NearApp: FC = () => {
  let [near, setNear] = useState<INearProps | null>(null);

  useEffect(() => {
    async function connect() {
      if (window.location.hash.indexOf('offer-processing') >= 0) {
        const currentUrl = new URL(window.location.href);
        const accountId = currentUrl.searchParams.get('account_id')
        if (accountId) {
          currentUrl.searchParams.delete('public_key');
          currentUrl.searchParams.delete('all_keys');
          currentUrl.searchParams.delete('account_id');
          currentUrl.searchParams.set('access', accountId)
          window.history.replaceState({}, document.title, currentUrl.toString());
        }
      }

      const near: INearProps = await connectNear()
      const accountId = await near.api.get_account_id()
      setNear({
        ...near,
        signedIn: !!accountId,
        signedAccountId: accountId,
      })
    }

    connect();
  }, []);

  return (
    <StrictMode>
      <NearContext.Provider value={{ near, setNear }}>
        <App />
      </NearContext.Provider>
    </StrictMode>
  )
}
Example #15
Source File: App.tsx    From joplin-utils with MIT License 6 votes vote down vote up 
App: React.FC = () => {
  return (
    <StrictMode>
      <HashRouter>
        <Suspense fallback={'加载中...'}>{renderRoutes(routeList)}</Suspense>
      </HashRouter>
    </StrictMode>
  )
}
Example #16
Source File: index.tsx    From cheeseswap-interface with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <FixedGlobalStyle />
    <Web3ReactProvider getLibrary={getLibrary}>
      <Web3ProviderNetwork getLibrary={getLibrary}>
        <Provider store={store}>
          <Updaters />
          <ThemeProvider>
            <ThemedGlobalStyle />
            <App />
          </ThemeProvider>
        </Provider>
      </Web3ProviderNetwork>
    </Web3ReactProvider>
  </StrictMode>,
  document.getElementById('root')
)
Example #17
Source File: index.tsx    From moodtracker with MIT License 6 votes vote down vote up 
ReactDOM.createRoot(document.getElementById("root")!).render(
  <StrictMode>
    <BrowserRouter>
      <Provider store={store}>
        <Routes />
      </Provider>
    </BrowserRouter>
  </StrictMode>
);
Example #18
Source File: index.tsx    From vite-react-ts with MIT License 6 votes vote down vote up 
// StrictMode 开启react严格模式
// 是因为Antd组件中有些使用了CSSTransition，但是CSSTransition中的部分代码的写法对于react而言，不是最新的写法，不是非常规范的写法，所以严格模式下的react就会抛出警告。但是这个实际并不影响使用，因为严格模式只会在开发模式下使用。在生产模式下就不会出现这样的警告了。

ReactDOM.render(
  <StrictMode>
    <App />
  </StrictMode>,
  document.getElementById('root'),
);
Example #19
Source File: index.tsx    From forward.swaps with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <FixedGlobalStyle />
    <Web3ReactProvider getLibrary={getLibrary}>
      <Web3ProviderNetwork getLibrary={getLibrary}>
        <Blocklist>
          <Provider store={store}>
            <Updaters />
            <ThemeProvider>
              <ThemedGlobalStyle />
              <HashRouter>
                <App />
              </HashRouter>
            </ThemeProvider>
          </Provider>
        </Blocklist>
      </Web3ProviderNetwork>
    </Web3ReactProvider>
  </StrictMode>,
  document.getElementById('root')
)
Example #20
Source File: index.tsx    From react-loosely-lazy with Apache License 2.0 6 votes vote down vote up 
App = ({ initialStep, components }: AppProps) => {
  const [step, setStep] = useState(initialStep);
  const { startNextPhase } = useLazyPhase();

  useEffect(() => {
    const listener = (v: string) => setStep(v);
    listeners.add(listener);

    return () => {
      listeners.delete(listener);
    };
  }, [setStep]);

  useEffect(() => {
    if (step === 'AFTER LOADING') {
      startNextPhase();
    }
  }, [step, startNextPhase]);

  return (
    <StrictMode>
      <h1>&nbsp;</h1>
      <main>
        <components.ForPaint />
        <components.AfterPaint />
        <components.Lazy />
        <components.CustomWait step={step} />
      </main>
    </StrictMode>
  );
}
Example #21
Source File: index.tsx    From sybil-interface with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <FixedGlobalStyle />
    <Web3ReactProvider getLibrary={getLibrary}>
      <Web3ProviderNetwork getLibrary={getLibrary}>
        <Provider store={store}>
          <Updaters />
          <ThemeProvider>
            <ThemedGlobalStyle />
            <HashRouter>
              <App />
            </HashRouter>
          </ThemeProvider>
        </Provider>
      </Web3ProviderNetwork>
    </Web3ReactProvider>
  </StrictMode>,
  document.getElementById('root')
)
Example #22
Source File: index.tsx    From sushiswap-exchange with GNU General Public License v3.0 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <FixedGlobalStyle />
    <Web3ReactProvider getLibrary={getLibrary}>
      <Web3ProviderNetwork getLibrary={getLibrary}>
        <Provider store={store}>
          <Updaters />
          <ThemeProvider>
            <ThemedGlobalStyle />
            <App />
          </ThemeProvider>
        </Provider>
      </Web3ProviderNetwork>
    </Web3ReactProvider>
  </StrictMode>,
  document.getElementById('root')
)
Example #23
Source File: index.tsx    From hub with Apache License 2.0 6 votes vote down vote up 
renderGroup = (element: HTMLElement) => {
  const { url, loading, theme, color, responsive, width, header, stars } = element.dataset;
  ReactDOM.render(
    <StrictMode>
      <root.section>
        <div style={{ all: 'initial' }}>
          <Group
            url={url}
            loading={isUndefined(loading) || loading === 'true'}
            header={isUndefined(header) || header === 'true'}
            stars={isUndefined(stars) || stars === 'true'}
            theme={theme}
            color={color}
            responsive={isUndefined(responsive) || responsive === 'true'}
            width={width}
          />
        </div>
      </root.section>
    </StrictMode>,
    element
  );
}
Example #24
Source File: main.tsx    From rewind with MIT License 6 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <AppInfoProvider appInfo={appInfo}>
      <TheaterProvider theater={theater}>
        <ThemeProvider theme={RewindTheme}>
          <CssBaseline />
          <WebTestApp />
        </ThemeProvider>
      </TheaterProvider>
    </AppInfoProvider>
  </StrictMode>,

  document.getElementById("root"),
);
Example #25
Source File: Root.tsx    From react-pwa with MIT License 6 votes vote down vote up 
function render(App: ComponentType) {
  root.render(
    <StrictMode>
      <RecoilRoot>
        <HelmetProvider>
          <ThemeProvider>
            <App />
          </ThemeProvider>
        </HelmetProvider>
      </RecoilRoot>
    </StrictMode>,
  );
}
Example #26
Source File: index.tsx    From Riakuto-StartingReact-ja3.1 with Apache License 2.0 5 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <App />
  </StrictMode>,
  document.getElementById('root'),
);
Example #27
Source File: index.tsx    From what-the-filter with MIT License 5 votes vote down vote up 
root.render(
  <StrictMode>
    <App />
  </StrictMode>,
);
Example #28
Source File: index.tsx    From Riakuto-StartingReact-ja3.1 with Apache License 2.0 5 votes vote down vote up 
ReactDOM.render(
  <StrictMode>
    <App />
  </StrictMode>,
  document.getElementById('root'),
);
Example #29
Source File: index.tsx    From wallet-adapter with Apache License 2.0 5 votes vote down vote up 
ReactDOM.render(
    <StrictMode>
        <App />
    </StrictMode>,
    document.getElementById('app')
);