Angular 10-有条件地动态加载特定的较少文件

问题描述

我在Angular(10.0.11)项目中使用Less样式表格式。

我正在使用较少的文件(超过50个主题)来处理主题,并且只有在调用了一些初始API之后才能识别此文件,所以我不能直接在styles.less中使用它。

假设资产/theme1.less 对应于 THEME_1 ,而资产/theme2.less 对应于 THEME_2 ,并且等等。App调用初始API,并告知UI将使用THEME_2。

能否请您介绍一种动态全局加载较少文件方法(在上述情况下为assets / theme2.less)?

解决方法

解决此问题的最佳方法是在不同的项目中编译您的主题文件,并在您的 API 调用后注入已编译的主题 css 文件。只需使用单个默认主题进行开发即可。

您可以根据要访问的主题名称生成具有不同路径的每个主题文件。

例如:{static-content-path}/{themename}.min.css