css - 带有 webpack 的多个 bootstrap 主题

标签 css twitter-bootstrap webpack bootstrap-4 webpack-2

我正在构建一个应用,其主题要求只能在运行时确定。在构建时,可以为所有主题提供主题变量。

是否有可能让 webpack 使用不同的变量文件来构建节点模块 - 在本例中为 Bootstrap ?我想在构建时我希望它构建多个版本/主题的 Bootstrap 。然后在运行时我可以根据一些前缀引用正确的 css 文件。

例如

theme1.bootstrap.css 
theme2.bootstrap.css
theme3.bootstrap.css

我正在使用带有 webpack 2 的 bootstrap 4。

可以使用 webpack 实现吗?

最佳答案

当然。我假设您正在根据用户配置文件类型系统确定主题。看看下面,添加一个 if 语句来查找 sql 中的变量,然后简单地应用 css。简单的。尝试创建它,如果您遇到麻烦,请在此处发布您的代码,我相信有人可以提供帮助。 Add stylesheet to Head using javascript in body体内脚本。此外,如果您还没有使用 bootstrap 允许主题文件,那么您可以保持整体样式加载并简单地应用您想要的配色方案,这样您只需要加载一次更大的脚本。

关于css - 带有 webpack 的多个 bootstrap 主题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42504747/

相关文章:

html - 背景没有覆盖整个区域

android - 网站页脚在我的移动设备上不稳定

html - 将此 h1 居中 'button'

python - Django 的新手。尝试查看有关如何加载 css 文件但无法正常工作的教程

javascript - 如何阻止模式对话框在单击按钮时关闭?

javascript - Safari 中的黑框而不是图像

css - Webpack/样式加载器/CSS 模块 : CSS Object and JS Code doesn't match

angular - 在 angluar2 webpack 中使用 Font-awesome

sass - 如何使用 ESLint 解决导入/ Unresolved 错误?

javascript - iOS 设备处理 :hover pseudo-class? 的默认方式是什么