如何解决这个 sass 插值问题

2024-04-22

警告:您可能不想在此处进行插值时使用颜色值白色。 它最终可能会呈现为白色,这可能会产生无效的 CSS。 将颜色名称用作字符串或映射键时,请始终引用颜色名称(例如“白色”)。 如果您确实想在此处使用颜色值,请使用 '"" + $colorName'。

   ╷
93 │       .text-#{$colorName}-#{$shade} {
   │               ^^^^^^^^^^
   ╵
    src\assets\styles\scss\_palette.scss 93:15  @import
    stdin 44:9  

我按照推荐尝试了这样的事情,

.text-#{'"" + $colorName'}-#{$shade} {

但仅仅添加引号是行不通的。 我正在使用角度 cli。


最近升级到Angular9并面临着同样的问题。就我而言,更新这个

.#{$colorName}#{$hue}-bg {
        background-color: $color !important;
}

to

.#{"" + $colorName}#{$hue}-bg {
        background-color: $color !important;
}

worked.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何解决这个 sass 插值问题 的相关文章

  • HTML 和 CSS 的基本编码标准 [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我想知道它们是否是像 PSR 01 这样的 HTML 和 CSS 基本编码标准 我尝试谷歌搜索和搜索 但没有找到 我建议看看类似的东西
  • 在角度项目中使用茉莉花进行单元测试订阅方法

    我正在尝试测试ngOnInit 具有的组件的方法subscribe method 成分 import Component OnInit from angular core import SharedDataService from serv
  • 所有 'size' 、 'prototype' 的声明必须具有相同的修饰符

    I have downloaded code from repository and run it on local getting these errors have following versions when i run ionic
  • 由于 ngIf 语句,存储选择未运行

    我正忙于 MeteorJS 和 RxJS 它们正在退出 但有时也有点令人困惑 我当前的问题只是 Angular NgRx 问题 与 MeteorJS 无关 正如您在示例中看到的 有一个ngIf基于showChannels 该布尔值设置为fa
  • 是否可以在 Ionic 2 中存储 firebase 数据并以离线模式运行应用程序功能?

    我找到了一些关于 Ionic 2 离线模式 firebase 的教程 但我仍然不知道如何在我的应用程序中启用这个功能 那么 firebase真的支持离线模式吗 如果是 我可以存储所有收到的数据吗 and 在离线模式下运行功能 firebas
  • 更改特定元素的滚动速度[关闭]

    很难说出这里问的是什么 这个问题是含糊的 模糊的 不完整的 过于宽泛的或修辞性的 无法以目前的形式得到合理的回答 如需帮助澄清此问题以便重新打开 访问帮助中心 help reopen questions 好吧 我不知道如何编写脚本 但是在
  • 当鼠标悬停在上面时制作一个 React Bootstrap NavDropdown 下拉菜单

    我试图让 React Bootstrap 中的下拉菜单栏在您显示选项时hover超过它 我到处查看 所有解决方案似乎都已过时并且不起作用 如果您能够解决此问题 请告诉我 这是我尝试将更改应用到的下拉菜单
  • Chrome 中的 CSS 列不平衡

    我想使用以下方法在多列中动态显示一些 Bootstrap 列表组CSS 列 https developer mozilla org en US docs Web Guide CSS Using multi column layouts 但我
  • Angular 2 + Auth0(找不到模块“auth0-js”的声明文件。)

    找不到模块 auth0 js 的声明文件 C sandbox loginauth0 node modules auth0 js src index js 隐式具有 any 类型 我想使用 auth0 登录 但在按照说明构建我自己的 Angu
  • CSS过渡div晃动

    为什么当我使用位置绝对和百分比宽度时 当我将鼠标悬停在上面的 div 上时会出现此故障 有例子 我在更复杂的网站上遇到了这个故障 div class box text div div class container div box widt
  • MVC 5 Razor 活动导航选项卡

    我一直在尝试突出显示我的项目中的活动导航选项卡 我的任务是更新旧网站而不更改为引导程序 这是我的经验所在 我找到了一个包含我需要的大部分内容的示例 目前 唯一具有 选定类别 的选项卡是 主页 选项卡 当我单击另一个选项卡时 主页 选项卡不再
  • Angular Firebase 电子邮件验证验证后错误

    我正在使用电子邮件和密码设置授权功能 一切正常 但当我创建新用户时 应用程序会发送一封带有验证链接的电子邮件 验证电子邮件地址后 我想登录 以便返回登录表单 emial verified 保持在 假 状态 在我硬重新加载页面后 这是 真 但
  • Angular 7 Guard 重定向仅适用于双击

    问题是我已经实现了一个 Guard 旨在处理特定的目录 如果当前用户名的角色等于 2 它应该返回 true 如果没有 那么它不应该重定向 这是我的 app routing module ts 文件 问题出在 userlist 路径中 我们是
  • 如何从 Firefox 中的选择元素中删除箭头

    我正在尝试设计一个select使用 CSS3 的元素 我在 WebKit Chrome Safari 中得到了我想要的结果 但 Firefox 的表现不佳 我什至不关心 IE 我正在使用 CSS3appearance属性 但由于某种原因我无
  • 如何使页面上的所有内容变大?

    如果我在浏览器中打开我的网站并按Ctrl 有几次 一切都变得更大 网站对我来说看起来更好 我可以通过在 HTML 代码中添加一些内容来实现相同的效果吗 以便用户默认看到更大的所有内容 而无需按Ctrl 我想让所有东西都变大 文本和图像 如果
  • Bootstrap 3 - 使用垂直滚动条水平拖动元素,overflow-y:滚动

    在我的失败之后上一篇文章 https stackoverflow com questions 23586926 bootstrap grid with scrollable affixed column noredirect 1 comme
  • IE8 底部:0 在位置:绝对的行为类似于位置:固定

    我有一个 DIV 必须始终位于页面的底部 左侧 类似于页脚菜单 div bottom menu position absolute z index 1 left 0 bottom 0 width 90 我的页面定义了最小高度 当用户将其缩小
  • jQuery 面板滑块通过单击按钮打开但不会关闭

    我的页面上有一个按钮 可以使用 jquery 和 Modernizr 框架打开右侧面板 按钮位于屏幕最右侧 单击时 它会向左滑动并打开打开的面板 问题是 再次单击时它不会滑回到原来的位置 HTML div class cd panel fr
  • IE 中的文件上传按钮和奇怪的文本光标行为

    我构建了一个上传按钮 其格式类似于典型的 html 按钮 而不是浏览器标准文件上传表单 该方法是设置锚元素的样式并在顶部覆盖透明文件输入元素 这种方法在除 IE 之外的所有浏览器中都可以正常工作 在 IE 中 当用户单击上传按钮时 会出现一
  • Angular + Material - 如何使用 formgroup 处理多个复选框

    我有一个从后端获得的兴趣列表 我希望用户能够选择他们想要的兴趣 我将只存储他们在数据库中检查的兴趣 并在他们加载页面时预先填充 但首先我需要获取用户选择的这些兴趣 兴趣组件 ts export class InterestsComponen

随机推荐