记录一次bug rollup-plugin-vue additionalData

环境vue3 打包工具rollup
vue3 使用的 vueloader工具 ---rollup-plugin-vue 在解析vue文件的时候，要注入的additionalData，总是报错 Can't find stylesheet to import.

但是经过再三确认 引入的路径（ additionalData: @import "./src/style/var.scss";）配置是没问题的，

后来经过确认这个bug是偶先的，在部分电脑上没问题，
发现是因为每次引入的路径 都是从要注入的vue文件开始计算路径的，也就是说，每个.vue文件所在目录结构中的位置是不一样的，文件要使用的路径是不一样的，那就是说不能用 @import "./src/style/var.scss"; 写死路径这种方式，而应该拿到目标.vue文件 距离 /src/style/var.scss 的路径 然后返回。

经过一番调研，作出以下调整； ``

........
vuePlugin({
        preprocessStyles: true,
        preprocessOptions: {
            scss: {
                additionalData: function(content, file) {
                    const relativePath = path.relative(__dirname, file);
                    const componentDirname = path.dirname(relativePath);
                    const varScssPath = path.relative(
                        componentDirname,
                        'src/style/var.scss'
                    ).replace(/\/g, '/');

                    // 详细的调试信息
                    console.log('\x1b[32m%s\x1b[0m', '处理文件:', file);
                    console.log('\x1b[36m%s\x1b[0m', '组件相对路径:', relativePath);
                    console.log('\x1b[36m%s\x1b[0m', '组件目录:', componentDirname);
                    console.log('\x1b[36m%s\x1b[0m', '生成的 SCSS 导入路径:', varScssPath);

                    return `@import "${varScssPath}";${content}`;
                }
            }
        },
        template: {
            isProduction: true,
        },
      }),
......
```
```
使用 additionalData 提供的函数方式，根据node的path模块 计算出 file 距离src/style/var.scss的路径，然后动态返回，完美解决。