1. 首页
  2. css

#168:JS中的CSS

下载视频
(只有MVP的支持者才能下载原始的高质量录音供离线观看。)

我和Dustin Schau一起观看了这段视频,他将带我参观JS中的CSS。也就是说,完全用JavaScript来做你的样式,而不是用你自己头脑中的.css文件。达斯廷是一个完美的指南,因为他在jsplayground中创建了一个名为CSS的伟大的探索性工具,并且在这个主题上有一个全新的课程。

,下面是我们在视频中讨论的一些原因:

  1. 消除死代码。加载的唯一样式是在任何给定时间使用的组件的样式。没有任何未使用的款式。当一个组件消亡时,它的样式也随之消亡。
  2. 范围界定。编写新样式不会影响站点其他地方的任何内容,因此无需担心由于全局范围中的选择器而编写的样式会在其他地方产生不良或意外的后果。我们用BEM这样的命名思想来保护范围,但它不是强制的。
  3. 不用担心命名。在某些情况下,由于输出包含在UI中,因此无需为正在设置的样式选择类名或ID。
  4. 开发人员人机工程学。在同一个文件中(或者非常接近)组件本身就很好了。同样,一些开发人员对JSX感到非常满意。同时,能够设计事物而不必担心范围,这意味着开发人员可能会觉得自己在设计样式方面得到了授权,而不是被它吓倒。
  5. 设计系统友好。设计系统都是关于组件的,因此是关于组件的。这些相辅相成的思维方式相互配合得很好。
  6. 在CSS中使用JavaScript的可能性。使用逻辑运算符、传入值、数学等等,充分利用JavaScript的风格是非常有用的。
    1. 这并不是全部,但您可以看到为什么它是令人信服的对某些人来说。这当然引起了很多讨论。为什么不提供所有这些好处呢?嗯,这是一个完全不同的开发环境,不一定每个人都喜欢。它需要弯曲web平台来做一些不寻常的事情,这也带来了一些缺点。更不用说还有一个字面上的成本(包的大小等),用户支付,你最好希望自己支付效率。Dustin甚至构建了一个演示,使用Sass来设计样式,并将其与JS中的CSS进行了比较,展示了移植样式的外观和可能性

      #168:JS中的CSS 为WP2原创文章,链接:https://www.wp2.cn/css/168js%e4%b8%ad%e7%9a%84css/

发表评论

您的电子邮箱地址不会被公开。