How to @extend class styles from another file without including the file itself?

Question

css

Hello, dear Toaster users. The question is the following.
For example I have code in table.scss file with some styles (for .table and not only)

.sel1 {...}
.sel2{...}
.table {
  ...
}
sel3{...}

And in the main.scss file, I want to use the styles of the .table class of the previous file

.my-table {
  @extend ...
}

I want to use the styles of this class in main.scss, but without importing the file into the final one (main.scss -> main.css). That is, so that main.css does not contain .sel2, .sel3, but only styles from .table (table.scss) are in .my-table (main.scss). After reading parts of the Sass manual, I didn't find any explicit instructions on how to do this. The _ table.scss import option does not work, the file is still imported completely, and not used in parts.
In another way, I want to use the styles from the frameworks in "my" classes without a long list of those classes in the HTML template. (the first answer https://toster.ru/answer?answer_id=516423 reflects what I want to do).
PS There is an option to use the so-called "placeholders" declared through %name {}, which is probably what is needed for this, but this is not a very convenient option.

Answer 1

Extending simply adds your selector to whatever you are extending. Therefore, you need a file with an extend. Mixins may be suitable for solving your problem:

.my-table {
    @include .table();
}

If you're using a CSS minifier, you don't have to worry about CSS being redundant. Minifier take care. And if you're not using a minifier, then it's time to start!
Don't overextend yourself .