css - 消息 "warning Unexpected string concatenation of literals"

标签 css gatsby

我遇到了多个与内联样式背景图像相关的警告。使用 React-static,我没有任何问题,但现在使用 Gatsby我收到此错误:

warning Unexpected string concatenation of literals

如果我只想使用内联样式,我该如何编写代码?

现在,我正在导入背景图片并使用内联样式。我宁愿导入图像并使用内联样式,也不愿创建多个 CSS 样式。

代码:

import Background from '../img/background.gif';
<div id="hero" className="header-banner" style={{background: 'url(' + `${Background}` + ')'}}></div>

最佳答案

看起来您已经在评论中弄明白了,这只是一个引用信息:您看到的消息来自 ESLint , 具体来说 this rule .

This rule aims to flag the concatenation of 2 literals when they could be combined into a single literal. Literals can be strings or template literals.

所以你的代码是有效的。这要么是 Gatsby 的默认 ESLint 设置,要么是您自己的设置对它很挑剔。如果您不喜欢该规则,可以通过 setting up your own ESLint setting 将其删除.

关于css - 消息 "warning Unexpected string concatenation of literals",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55108227/

相关文章:

sorting - 客户端 graphQL 排序 - 可以添加一个将 graphql 查询排序从 ASC 反转为 DESC 的按钮吗?

javascript - GatsbyJS 和 Contentful 与 SSR

css - 为什么 &lt;!DOCTYPE html> 打破高度 : 100%?

javascript - 错误 #98123 WEBPACK 在 `gatsby develop` 上生成开发 JavaScript 包失败

php - 如何在 Laravel 5.2 中编辑 bootstrap css 文件

javascript - 下拉菜单中的 Bootstrap 4 选项卡

reactjs - 无法忽略带有 istanbul 的 React 类组件中的 block 忽略旁边以获得覆盖

javascript - 使用 gatsby-plugin-sitemap 仅生成一个页面到站点地图

html - CSS - 尝试让内容按比例缩小以适应较小的屏幕

jquery - 将 jQuery UI CSS 应用于 MVC .input-validation-error