Vue项目引入sass模块_sass 1.26.2-优快云博客

本文链接：https://blog.youkuaiyun.com/weixin_44922964/article/details/121759668

本文指导读者如何在Vue项目中解决因缺失Sass依赖导致的样式编译错误，通过添加`sass`和`sass-loader`到package.json并安装，确保lang='scss'的样式正确编译。

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

当我写入样式的是报错

<style lang='scss' scoped>
样式
</style>

在这里插入图片描述

* !!vue-style-loader!css-loader?{"sourceMap":true}!../../../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-1af63085","scoped":true,"hasInlineConfig":false}!sass-loader?{"sourceMap":true}!../../../../nod
e_modules/vue-loader/lib/selector?type=styles&index=0!./index.vue in ./src/views/error/error-404/index.vue

To install it, you can run: npm install --save !!vue-style-loader!css-loader?{"sourceMap":true}!../../../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-1af63085","scoped":true,"hasInlineConfig":false}!s
ass-loader?{"sourceMap":true}!../../../../node_modules/vue-loader/lib/selector?type=styles&index=0!./index.vue

根据这里的提示没有安装sass依赖导致的，lang=‘scss’
网上很多方案，我选择一个最朴素的方案
1、首先找到package.json文件
将以下两个依赖拷贝进入devDependencies中：

"sass": "1.26.2",
"sass-loader": "^7.3.1",

2、然后npm install 即可版本是固定的，最好别搞太高，因为Vue-cli向下兼容的能力挫的一批叼遭