vue3.0 引用公共文件的混入样式，报错：SassError: Undefined mixin.定位于@include XXXXXX;

xiaozhi_free

于 2019-12-20 16:04:04 发布

阅读量1.4w

点赞数 1

分类专栏： vue sass

本文链接：https://blog.youkuaiyun.com/xiaozhi_free/article/details/103633958

版权

vue 同时被 2 个专栏收录

2 篇文章

订阅专栏

sass

1 篇文章

订阅专栏

本文介绍如何在Vue3.0项目中配置Sass预处理器，通过正确设置vue.config.js文件，确保全局样式变量和混合可以被所有组件访问。文章详细解释了旧版和新版Sass选项的区别，避免配置错误导致的'optionshasanunknownproperty'data'报错。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

vue3.0根目录新建文件vue.config.js

配置：

module.exports = {
    css: {
        loaderOptions: {
            sass: {
                prependData: `@import "@/assets/css/mixin.scss";`
            }
        }
    }
}

注：旧版本sass 用data: `@import "@/assets/css/mixin.scss";`

新版本sass 用prependData: `@import "@/assets/css/mixin.scss";`

否则报错：options has an unknown property 'data'.