linaria 正在参加 2021 年度 OSC 中国开源项目评选,请投票支持!
linaria 在 2021 年度 OSC 中国开源项目评选 中已获得 {{ projectVoteCount }} 票,请投票支持!
2021 年度 OSC 中国开源项目评选 正在火热进行中,快来投票支持你喜欢的开源项目!
2021 年度 OSC 中国开源项目评选 >>> 中场回顾
linaria 获得 2021 年度 OSC 中国开源项目评选「最佳人气项目」 !
授权协议 MIT
开发语言 JavaScript TypeScript
操作系统 跨平台
软件类型 开源软件
所属分类 Web应用开发CSS框架
开源组织
地区 不详
投 递 者 白开水不加糖
适用人群 未知
收录时间 2021-09-03

软件简介

linaria 是一个零运行时 CSS-in-JS 库。在 JS 中编写 CSS,并在构建期间获得真正的 CSS 文件。使用 React 绑定的基于动态道具的样式,并将其自动转换为 CSS 变量。通过 source maps 和 linting 支持获得巨大的生产力。

特性:

  • 在 JS 中编写 CSS,但运行时间为零,CSS在构建时被提取到 CSS 文件中
  • 熟悉的 CSS 语法与 Sass 一样嵌套
  • 使用基于 React 绑定的动态道具样式,在幕后使用 CSS 变量
  • 通过 CSS 源码图轻松找到样式的定义位置
  • 使用 stylelint 在 JS 中提示你的 CSS
  • 使用 JavaScript 的逻辑,不需要 CSS 预处理程序
  • 可以选择使用任何 CSS 预处理器,如 Sass 或 PostCSS 
import { css } from '@linaria/core';
import { modularScale, hiDPI } from 'polished';
import fonts from './fonts';

// Write your styles in `css` tag
const header = css`
  text-transform: uppercase;
  font-family: ${fonts.heading};
  font-size: ${modularScale(2)};

  ${hiDPI(1.5)} {
    font-size: ${modularScale(2.5)};
  }
`;

// Then use it as a class name
<h1 className={header}>Hello world</h1>;
展开阅读全文

代码

的 Gitee 指数为
超过 的项目

评论

点击引领话题📣 发布并加入讨论🔥
暂无内容
发表了博客
{{o.pubDate | formatDate}}

{{formatAllHtml(o.title)}}

{{parseInt(o.replyCount) | bigNumberTransform}}
{{parseInt(o.viewCount) | bigNumberTransform}}
没有更多内容
暂无内容
发表了问答
{{o.pubDate | formatDate}}

{{formatAllHtml(o.title)}}

{{parseInt(o.replyCount) | bigNumberTransform}}
{{parseInt(o.viewCount) | bigNumberTransform}}
没有更多内容
暂无内容
暂无内容
0 评论
0 收藏
分享
OSCHINA
登录后可查看更多优质内容
返回顶部
顶部