vue scoped 是否建议或不建议 使用?

我的神
  • 966

我们团队的规范有这么一条:
如图,请大家分析一下利弊。。谢谢。。
image.png

回复
阅读 1.5k
4 个回答

我猜会影响选择器优先级,会让一部分新人感到困惑

问制订规范的人要理由。

所有编码规范都是“约定”,而非“准则”,也不存在一种所有公司都完全一致的编码规范,只要你们内部认可并遵守就好了。至于寻求认同这件事儿本身,应该在你们内部进行。

冯恒智
  • 7.8k

鬼知道,问规则制定人+1
https://cn.vuejs.org/v2/style...
vue官方的style guide是把为组件样式设置作用域列为必要优先级的,使用scoped style是组件样式设置作用域放到最前面的好例子

如果你和其他开发者一起开发一个大型工程,或有时引入三方 HTML/CSS (比如来自 Auth0),设置一致的作用域会确保你的样式只会运用在它们想要作用的组件上。

不止要使用 scoped attribute,使用唯一的 class 名可以帮你确保那些三方库的 CSS 不会运用在你自己的 HTML 上。比如许多工程都使用了 button、btn 或 icon class 名,所以即便你不使用类似 BEM 的策略,添加一个 app 专属或组件专属的前缀 (比如 ButtonClose-icon) 也可以提供很多保护。

https://cn.vuejs.org/v2/style...
官方的意思是只要不在scoped style中使用元素选择器可以随便用

scoped有什么缺点呢?通用组件可能无法在不同的地方通过样式覆盖来满足不同的UI。
scoped又有什么优点呢?一定程度上减少了打包后的css量,同时防止命名冲突之类之类的。

既然是约定,按照约定也没有问题。比如大家统一按照BEM规则来写自己的样式,或者有类似tailwind的解决方案,没有什么不可以呀。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏