CSS font-family属性IDE（PHPStorm）警告

Question

我正在使用PHPStorm 8.0.3，在我的CSS文件中，我收到了font-family规则的警告。

  

此检查验证CSS font-family属性是否包含   通用字体名称作为后备替代。

我添加了如下字体：

.my_text {
    font-family: 'DINPro-Medium';
}

@font-face {
    font-family: 'DINPro-Medium';
    src: url(font/DINPro-Medium.eot);
    src: url(font/DINPro-Medium.eot?#iefix) format('embedded-opentype'),
    url(font/DINPro-Medium.ttf) format('truetype'),
    url(font/DINPro-Medium.woff) format('woff'),
    url(font/DINPro-Medium.svg#DINPro-Medium) format('svg');
    font-weight: normal;
    font-style: normal;
}

我无法理解问题所在。

Answer 1

建议在使用自定义字体时添加通用字体系列作为后备。

EG。 font-family: 'DINPro-Medium', serif;

如果浏览器无法加载自定义字体的文件，则会使用通用的serif字体。

Answer 2

取消选中此复选框将禁用该复选框：

设置→编辑器→检查→CSS→可能的错误→缺少通用字体名称

Answer 3

只需在代码块前添加注释：

  const [userId, setUserId] = useState<string>("");


  const getMyUserId = async () => {
    const { data: objects } = await axios.get("/"); 
    const user_id = objects.objects[0].id.toString(); 
    setUserId(user_id);
    console.log("userId", userId); <- output is empty string
  };

  const getMyCalendarId = async () => {
    const url = `/${userId}/cal/calendars`;
    const { data: objects } = await axios.get(`${url}`);
    const calendar_id = objects.objects[0].id.toString();
    setCalendarId(calendar_id);
  };
    
  useEffect(() => {
    getMyUserId(); <- render every time page is loaded
    getMyCalendarId
  }, []);

你可以阅读它： https://www.jetbrains.com/help/webstorm/disabling-and-enabling-inspections.html#suppress-inspection-results