Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Scoped scss issue in the project #27

Open
sazanami0320 opened this issue Mar 20, 2024 · 1 comment
Open

Scoped scss issue in the project #27

sazanami0320 opened this issue Mar 20, 2024 · 1 comment
Labels
enhancement New feature or request

Comments

@sazanami0320
Copy link

sazanami0320 commented Mar 20, 2024

本工程使用了scss,并且大量的在不同的Vue组件中使用了scoped scss块;这虽然使得所有组件的样式对开发者而言变得清晰可见,但同时也引入了大量的重复代码。

例如,所有的类似对话框的组件(capture、alert等)都需要加一个背景Mask;而这些mask的scss实际上几乎完全一致。如果想要进一步对本组件的mask进行个性化,完全可以在scoped里单独描写,没必要复制一遍10行的.mask{blahblah}。同理,部分选择器.container, .confirm-btn之类的也可以提到全局的样式表中,没必要针对每个组件写一次。

目前个人能想到的这一行为的缺点有如下几个:

  1. css被隐藏到全局,开发者可能会忘记class对应的意义;
  2. 全局css膨胀可能导致网站第一次加载速度下滑;

但这一行为的好处也同样明显,一来至少不用复制粘贴,二来组件的大小降低了,三来scss行数缩短也可以突出整个组件配置的重点;此外scoped scss也可以通过@extend等特性活用全局的scss。因此想提个issue询问下这个是design的一部分还是可以优化的点

(在写bug的12和需求的2,但这俩都需要dialog,这个问题就很明显)

顺带一提,这个过程确实有点像重新发明UI框架

@KUN1007
Copy link
Owner

KUN1007 commented Mar 20, 2024

非常感谢您的反馈
我们目前主要是需要开发新功能,组件封装虽然很重要,但是我们还是决定在把逻辑写完之后再进行优化

另外,关于需求和 BUG,您可以加入我们的开发群组便于通知,因为我们刚才发现网站的链接更新不是很及时,需求的 2 已经有人负责写了

Tencent QQ: 872839714
Telegram: https://t.me/KUNForum

@KUN1007 KUN1007 added the enhancement New feature or request label Mar 20, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants