Is it possible to import scss mixins globally in create react app?

Please tell me, is it possible to somehow globally import a library with mixins or variables into the create react app application WITHOUT resorting to eject?

Let's say I have a grid, let it be a Bootstrap preprocessor grid that gives mixins for generating grid elements-containers, rows, and columns, that is, like this:

.myContainer {
  @include make-container();
  @include make-container-max-widths();
}

.myRow {
  @include make-row();
}
.myCol {
  background-color: yellow;
  @include make-col-ready();
  @include make-col(4);
  @include media-breakpoint-down(sm) {
    @include make-col(6);
  }
  @include media-breakpoint-down(lg) {
    @include make-col(12);
  }
}

I use the css module for styles in react and I would like to have access to these mixins in each css module – I can't find a normal solution.

Now I do this-just import these mixins in each module at the very top of the css module

@import "./grid/index.scss";

And then the mixins work inside the module.

Well, first of all, it's not very convenient, constantly importing the same file into the module – well, that's fine, nonsense.

But, secondly, in this case, all the code of these mixins is duplicated in each of the css modules, although this is only in dev mode, in build the code is clean, but everything equal-mixins pull up a bunch of standard css from the library and insert it into each one, and it's kind of jarring. Is there no normal solution to such a problem?

enter a description of the image here I would like to specify once what you need to import and just use the mixins in those css modules where it is necessary.

Author: mr__scrpt, 2020-04-01