我努力实现的目标

我正在尝试创建一个小型库供个人使用-基本上只是将一些代码拆分为lib（产品）和app（项目）代码。
我所有的源代码都保存在/src文件夹中，其中包含React, TypeScript and SCSS代码。如果我可以直接在React中使用SCSS导入，那就太好了，比如：import './_button.scss';
我有另一个SCSS文件：src/style/_main.scss它包括一些mixin，全局样式，重置等。

配置文件

import commonjs from '@rollup/plugin-commonjs';
import json from '@rollup/plugin-json';
import resolve from '@rollup/plugin-node-resolve';
import terser from '@rollup/plugin-terser';
import typescript from '@rollup/plugin-typescript';
import url from '@rollup/plugin-url';
import dts from 'rollup-plugin-dts';
import scss from 'rollup-plugin-scss';
import { format, parse } from 'path';
import pkg from './package.json' assert { type: 'json' };

const getTypesPath = (jsFile) => {
    const pathInfo = parse(jsFile);
    return format({
        ...pathInfo,
        base: '',
        dir: `${pathInfo.dir}/types`,
        ext: '.d.ts',
    });
};

export default [
    {
        input: 'src/index.ts',
        output: [
            {
                file: pkg.main,
                format: 'cjs',
                interop: 'compat',
                exports: 'named',
                sourcemap: true,
                inlineDynamicImports: true,
            },
            {
                file: pkg.module,
                format: 'esm',
                exports: 'named',
                sourcemap: true,
                inlineDynamicImports: true,
            },
        ],
        plugins: [
            resolve({ browser: true }),
            commonjs({ extensions: ['.js', '.jsx', '.ts', '.tsx'] }),
            typescript({ tsconfig: './tsconfig.build.json' }),
            url(),
            scss({
                failOnError: true
            }),
            json(),
            terser(),
        ],
        external: ['react', 'react-dom'],
    },
    {
        input: getTypesPath(pkg.module ?? pkg.main),
        output: [{ file: pkg.types, format: 'esm' }],
        plugins: [dts()],
    },
];

我的tsconfig.build.json如下所示：

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./types",
    "declaration": true,
    "declarationDir": "./types",
    "allowSyntheticDefaultImports": true
  }
}

我挣扎的地方

现在的主要问题是，它在定义文件中导入我的SCSS文件，例如button.d.ts看起来像：
一个二个一个一个
这确实是个问题，但我该如何解决呢？
我也得到了错误：

Error:
        @use rules must be written before any other rules.
  ╷
4 │ @use 'src/style/util/mixin';
  │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  stdin 4:1  root stylesheet

但是这实际上没有多大意义，因为我的_button.scss部分代码在第一行就写了这个。

我的问题

我怎样才能让它工作，以便我可以在我的库中使用SCSS？最好的情况是我不必接触我的原始代码。我只想转换/捆绑它，以便我可以在其他地方使用它。有什么建议吗？