react-client-sdk icon indicating copy to clipboard operation
react-client-sdk copied to clipboard

ReactSdkContext - Re-exporting a type when the '--isolatedModules' flag is provided requires using 'export type'.

Open RyanMacBern opened this issue 2 years ago • 3 comments

Describe the bug When importing ReactSdkContext into my app I receive an error message and the build fails: Re-exporting a type when the '--isolatedModules' flag is provided requires using 'export type'.

To reproduce Import ReactSdkContext. The workaround is to not import the type.

Expected behavior Should not break the build

Logs Re-exporting a type when the '--isolatedModules' flag is provided requires using 'export type'.

SDK version v3.0.0 and above

Language version, developer tools Webpack v5.70.0, CRA

OS/platform MacOS Ventura 13.2.1

RyanMacBern avatar Mar 23 '23 14:03 RyanMacBern

Thanks @RyanMacBern . The ReactSdkContext is an internal interface not exposed publicly. Are you able to share your use case so I can understand why you need to import this directly into your app please?

yusinto avatar Mar 23 '23 23:03 yusinto

I upgraded to the latest SDK and got an error in this file because I needed to add flakKeyMap. So I tried pulling in ReactSdkContext for the provider value and it broke my build.

import React from 'react';

import { LDFlagKeys, LDFlags } from 'config';
import { Provider, ReactSdkContext } from 'launchdarkly-react-client-sdk/lib/context';

const mockedFlags = Object.values(LDFlagKeys).reduce((flags, key) => ({ ...flags, [key]: true }), {});

export interface Props {
  children?: React.ReactNode;
  flagOverrides?: LDFlags;
}

const LDFlagContextProviderMock: React.FC<Props> = (props: Props) => {
  const value: ReactSdkContext = { flags: { ...mockedFlags, ...props.flagOverrides }, flagKeyMap: {} };
  return <Provider value={value}>{props.children}</Provider>;
};

export default LDFlagContextProviderMock;

My workaround is simply:

const LDFlagContextProviderMock: React.FC<Props> = (props: Props) => {
  return <Provider value={ { flags: { ...mockedFlags, ...props.flagOverrides }, flagKeyMap: {} }}>{props.children}</Provider>;
};

RyanMacBern avatar Mar 27 '23 15:03 RyanMacBern

Hey @yusinto, our team here is running into this issue as well even though we don't have any code directly importing ReactSdkContext. We are only importing withLDConsumer, LDProps, and LDProvider from the sdk

I'm able to fix the issue with the following patch:

diff --git a/node_modules/launchdarkly-react-client-sdk/src/context.ts b/node_modules/launchdarkly-react-client-sdk/src/context.ts
index c8bfbe7..8b22b53 100644
--- a/node_modules/launchdarkly-react-client-sdk/src/context.ts
+++ b/node_modules/launchdarkly-react-client-sdk/src/context.ts
@@ -47,5 +47,6 @@ const {
   Consumer,
 } = context;
 
-export { Provider, Consumer, ReactSdkContext };
+export { Provider, Consumer };
+export type { ReactSdkContext };
 export default context;

JamisonSavvyWealth avatar Nov 28 '23 19:11 JamisonSavvyWealth