The stylesheet (scss) in the Element UI component library is written separately from the package (vue). What is the advantage of writing this way?

such as the title.
if only to separate stylesheets, then the plug-in ExtractTextWebpackPlugin in webpack can also solve the problem of style separation
and referencing element-ui requires the introduction of all styles separately. If only one component is used, all component styles are introduced. Doesn"t that increase the amount of code?
it can be troublesome to introduce styles alone
so what are the advantages or necessity of this encapsulation of element-ui?
as shown in figure

clipboard.png
this is the style separation section

The uniqueness and weight of

style elements all involve

.
Menu