更新：我知道发生了什么，但没有人可以回答，因为丢失了很多信息——比如明暗变量文件被导出到哪里。答案，无处不在……他们到处都在导出，所以很自然地，这两个文件都包含在前端。

扩展我之前的问题，因为我尝试了与我在网上找到的不同的方法。

我没有尝试基于应用程序变量和样式表的扩展来加载某些样式表，而是定义了两个 css 变量文件，并且只希望为前端应用程序加载一个。

import React, {lazy, Suspense} from "react";
import ApplicationVariable from "./appVars";
import LoadingComponent from "../loadingComponent"; // our fallback

// I made 2 components that import the light/dark-variables.scss files;    
const LightThemeVariables = lazy(() => import("./light-variables"));
const DarkThemeVariables = lazy(() => import("./dark-variables"));

export const ThemeSelector = ({ children }) => {
    return (
        <>
            <Suspense fallback={<LoadingComponent loading={true} />}>
                {ApplicationVariable.isLight() ? <LightThemeVariables /> : <DarkThemeVariables  />}
            </Suspense>
            {children}
        </>
    );
};

// Then in the frontend application I wrapped my app in the ThemeSelector
ReactDOM.render(
        <ThemeSelector>
            <App />
        </ThemeSelector>,
    document.getElementById('root')
);

根据我读到的内容，上述操作将使我的应用程序有时间确定它需要哪些变量文件，然后在使用可供用户使用的加载组件做出“决定”作为发生某事的反馈后加载应用程序。

它有效，我可以看到加载程序，但是我仍然得到两个变量文件。

可能是因为我在src目录中有变量吗？我把它们移得更高了，它们都还在加载。我已经清除了缓存，删除了构建以使其尽可能干净但没有成功。

我难住了。指导将不胜感激！