node-sass - @import と $variables を使用して scss を rollupjs にコンパイルします。

Question

rollupjs を使用して最初の angular ライブラリをコンパイルしています。あなたの助けが必要です :)

現在、私は次のような構造を持っています：

.src
 --components
   --component1
     --component1.ts
     --component1.scss
     --component1.html
 --common
   --_variables.scss

そして、私のcomponent1.scssは次のようになります

@import "../../core/sass/variables";

:host {

.trigger {

        &.clear_btn {
            color: $color-grey;
        }
    }
}

私の variables.sccs は次のようになります。

$color-grey-light: #e3e3e3;
$color-grey: #bfbfbf;

私のrollup.config.jsは次のようになります：

export default {
    input: 'build/index.js',
    output: {
        file: 'dist/common.js',
        format: 'es',
    },
    plugins: [
        angular({
            preprocessors: {
                template: template => minifyHtml(template, htmlminOpts),

                style: scss => {
                    const css = sass.renderSync({data: scss}).css;
                    return cssmin.minify(css).styles;
                },
            }
        })
    ],
    external: [
        '@angular/core',
        '@angular/animations',
        '@angular/router',
        '@angular/platform-browser',
        '@angular/forms'
    ]
};

しかし、実行すると次のエラーが発生します。

[!] (angular plugin) Error: File to import not found or unreadable: ../../core/sass/variables.
Parent style sheet: stdin
build/app/components/toggle/toggle.component.js
Error: File to import not found or unreadable: ../../core/sass/variables.
Parent style sheet: stdin...

node-sassからインポーターを追加しようとしましたが、正直なところ、それを使用してすべてを css にコンパイルし、それを js に挿入する方法がわかりません (実際には、rollup-plugin-angular を使用してテンプレートに scss を挿入できますが、 scss のコンパイル方法がわかりません)

ヘルプ、ヒント、または提案は本当に高く評価されます:)