javascript - Kommer denna importstruktur att vara ett problem (Circulär import)?
Jag har en multi-tenant React-app. Därför har jag skapat en config.ts-fil (som innehåller alla konfigurationer) och en getConfigs.ts (som innehåller en funktion för att hämta konfigurationerna för en enskild tenant). Detta är okej, men ibland behöver jag ha olika komponenter baserat på den tenant för vilken appen byggs. Därför importerar jag dynamiskt vissa komponenter i min config. Jag tror dock att jag kan ha ett problem eftersom komponenter som jag importerar i min config-fil också är beroende av configen själv. Jag är osäker på om jag kan gå vidare med den struktur jag har skapat.
Mina importeringar ser i princip ut så här:
Filén getConfigs.ts exporterar en funktion som bygger det använda konfigurationsobjektet.
import { isEmpty, merge } from 'lodash';
import configs from './configs';
let cachedConfigs: typeof configs.default | {} = {};
const getConfigs = (client: keyof typeof configs, force = false) => {
if (!isEmpty(cachedConfigs) && !force) {
return cachedConfigs as typeof configs.default;
}
const defaultConfig = configs.default;
const clientConfig = configs[client];
const mergedConfig = merge(defaultConfig, clientConfig);
cachedConfigs = mergedConfig;
return mergedConfig as typeof configs.default;
};
Filen configs.ts exporterar ett objekt med följande form
const configs = {
default: {
login: {
layout: 'default'
},
component_a: {items: [{label: test}]}
clientA: {
login: {
layout: 'custom'
template: lazy(() => import($path_to_component_a))
},
}
Till exempel i componentA.tsx kan jag göra:
const ComponentA = (props: any) => {
const config = getConfigs(process.env.CURRENT_TENANT ?? 'default');
const { items } = config.component_a;
return (
<div>
{items?.map((item: any, index: number) => (
<Button key={index} >
{item.label}
</Button>
))}
</div>
);
};
Denna kod fungerar redan, men jag trodde att jag hade skapat en cirkulär import här? Misstar jag mig på något? Är det en bra idé att gå vidare med denna idé eller borde jag tänka på ett annat tillvägagångssätt.
