使用sass限制第三方css的范围

Question

我需要在旧版应用程序中显示SPA（不允许使用iframe）。 SPA应用程序使用第三方css。不幸的是，第三方CSS正在干扰遗留应用程序的样式，我需要以某种方式限制其范围。我想在SPA中做这样的事情：

<div class="use-third-party-css">
    <!-- SPA -->
</div>

为了能够做到这一点，我创建了一个scss文件：

.use-third-party-css { 
     @import "../node_modules/third-party/dist/default";
}

目前它工作正常，但是它给了我一个警告，即导入css的功能已弃用，很快就会删除。 有没有办法实现这一目标＆＃34;范围＆＃34;更容易和/或没有警告？ 修改 还有一个scss版本，我可以这样做：

.use-third-party-css { 
     @import "../node_modules/third-party/src/default.scss";
}

但它不适合我，因为以下＆＃34;意外＆＃34;行为。以下文件：

@mixin testMixin() {
    &-a > &-b {
       color: black;
   }
}

.c {
   @include testMixin();
}

将改为

.use-third-party-css .c-a > .use-third-party-css .c-b {
    color: black; 
}