运行项目时出现sass-resources-loader报错

已于 2022-10-21 17:28:05 修改
阅读量647 收藏
点赞数 1
文章标签： 前端 sass
于 2022-10-21 15:05:51 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_67818946/article/details/127440586
版权

最近在项目当中遇到一个有点比较恶心的一处报错，sass文件一直是无法编译的，你会自己尝试着重新下载sass，然而你满心欢喜得以为我真是个小天才这都想到了的时候，他会给你一个响亮的耳光

 这个问题我也尝试过很多中办法比如：卸载sass-loader重新安装，或者连带着node-sass和sass-loader一起降低版本进行兼容，可是始终无法解决这个bug，后来发现这不单单是sass-loader的问题了，后来翻译了一下报错终于找出了问题所在

#    sass-loader: 将 scss 文件编译为 css 文件

#    sass-resources-loader: 全局加载 scss 文件

解决方法：

把下面的命令在cmd中先下载全局加载scss文件，下载完成之后就可以再次尝试运行项目啦

npm i -D sass sass-loader@10.2.1 sass-resources-loader

一个神奇的睿智少年
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
sass-resources-loader：用于Webpack的SASS资源（例如变量，mixins等）的加载器。 也适用于less，post-css等
02-27
sass-resources-loader 该加载程序会将您的SASS资源加载到每个required SASS模块中。 因此，您可以在所有SASS样式中使用共享变量，mixin和函数，而无需在每个文件中手动加载它们。 适用于CSS模块！ 该加载器不限于Sass资源。 据说每个可以使用更少的，css之后的版本等。 支持Webpack 4 支持Sass @use语法。 您必须使用Dart Sass（ sass ，而不是node-sass npm软件包）。 请参阅hoistUseStatements选项。 关于 该项目由软件咨询公司。 我们专注于带有React前端的Ruby on Rails应用程序，通常使用TypeScript或ReasonML。 我们还建立了盖茨比站点。 有关的示例，请参见。 请随时联系与Justin Gordon联系以获取更多信息。 松弛室： 。 安装 通过np
nuxt-sass-resources-loader：用于NuxtJ的SASS资源（例如变量，mixins等）模块
02-05
:warning_selector: 我们正在关闭对此软件包的支持，并已将其转移到... 'nuxt-sass-resources-loader' ] , // your settings here sassResources : [ '@/path/to/first-resources.sass' ] } // @nuxtjs /style-re
Vue 中实现全局引入 scss 变量
tanqin的博客
08-03 1927
Vue 中实现全局引入 scss 变量
推荐使用：sass-resources-loader - 共享Sass资源的利器！
最新发布
gitblog_00044的博客
05-15 353
推荐使用：sass-resources-loader - 共享Sass资源的利器！ 项目地址:https://gitcode.com/shakacode/sass-resources-loader 在前端开发中，保持代码风格一致性和重用性是至关重要的。为此，我们推荐一个强大的工具——sass-resources-loader，它允许你在所有的Sass模块中自动引入共享的变量、混合和函数，无需逐个文...
vue项目中sass全局引用变量 sass-resources-loader webpack配置
南北极之间
01-20 3648
sass变量使用 vue中全局引用sass变量 sass-resources-loader webpack配置
vue项目中使用scss
热门推荐
weixin_45665171的博客
03-29 1万+
vue项目中安装、引入、使用scss
node-sass和sass-loader下载.zip
02-18
最后，运行`npm install`或`yarn`，这将只更新你的`package-lock.json`或`yarn.lock`文件，不会重新下载`node-sass`和`sass-loader`，从而避免了之前的错误。 总的来说，`node-sass`和`sass-loader`是前端开发中...
node-sass 4.12、4.14.1、5 node-sass-loader node_modules 安装包
07-07
1. **版本兼容性**：确保Node-Sass和Sass-Loader版本之间以及它们与Webpack和其他相关库的版本兼容，避免出现不兼容导致的错误。 2. **配置Webpack**：需要在Webpack配置文件中正确设置Sass-Loader，指定它应该处理...
解决vue cli4升级sass-loader(v8)后报错问题
10-15
主要介绍了解决vue cli4升级sass-loader(v8)后报错问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue-cli3引入sass(.scss)样式管理、sass-resources-loader全局变量
shawxlee的CSDN博客
12-30 3948
style lang = " scss " > /* 标记语言为scss */ div {/* 直接书写变量 */ margin : 0;h1 {/* 使用 @include 引入混合样式 */ padding : 0;< style lang = " scss " > /* 标记语言为scss */ div {/* 直接书写变量 */ margin : 0;h1 {/* 使用 @include 引入混合样式 */ padding : 0;
sass-resources-loader, SASS资源( 比如 变量，mixin 等等 ) 加载程序 web service.zip
10-10
sass-resources-loader, SASS资源( 比如 变量，mixin 等等 ) 加载程序 web service ： ShakaCode team availability availability availability availability 。你的团队需要我的帮助，请在上免费发送半小时的项目咨询，从对的响应到对消费者和企业产品的移动应用程序
sass-resources-loader 全局注册 Sass/Less 变量
sunluyi的博客
01-04 1854
首选，安装 less 和 less-loader ，在项目目录下运行如下命令 npm install less less-loader --save npm i sass-resources-loader // 修改utils.js if (loader) { if (loader == 'less') { loaders.push({ load...
Vue中全局导入scss
小火车况且况且况且的博客
05-21 1578
Vue中全局导入scss 需求: 定义的全局变量和mixins都需要在每个文件下面导入一次, 显得过于繁琐 借助于第三方模块sass-resources-loader可以很方便的直接在全局导入 首先下载npm i sass-resources-loader 在 vue.config.js中配置, 没有就新建一个 module.exports = { chainWebpack: (config) => { const oneOfsMap = config.module.rule('
通过 sass-resources-loader 全局注册 Sass/Less 变量
03-21 642
使用webpack引入sass/less全局变量 sass或者less都提供变量设置，在需求切换主题的项目中使用less或者sass变量，只要修改变量值，编译后所有用到该变量的样式都会被修改为你想要的效果，但是在vue-cli搭建的项目中，在main.js中全局引入一个scss文件，在其中定义变量在其他组件或者页面中引用报变量未定义错误，其他的样式可以正常显示，显然是编译的问题。 傻...
借助sass-resources-loader实现less，scss变量全局注册
qq_41538952的博客
02-11 701
sass与less是两个css预编译器，借助scss-loader和less-loader将.scss文件和.less文件编译为浏览器认识的css;两者的使用类似，scss声明变量使用$,less声明变量使用@，两者的编译环境不一样，scss是在服务端编译，也就是不用浏览器花时间去编译，less就是前端（浏览器），但个人感觉这并没有为scss带来多大优势；网上也常用人说都什么年代了，还用less，个人就觉得less与scss都差不多，用什么只看个人习惯了，不必跟风！下面就来说一下注册全局变量之后怎么才能在.
@craco/craco复写cra项目配置
Suk__的博客
02-04 3225
cra内置了HtmlWebpackPlugin插件,直接用cra的getPlugin方法获取插件实例即可。cra默认打包后的产物文件夹名build,我们习惯性的叫dist。
使用craco配置全局sass
Bunny的博客
09-22 245
使用craco配置全局sass。
vue.config.js配置sass-resources-loader
qq_45593068的博客
04-25 4670
配置sass-resources-loader 详细查看sass-resources-loader的GitHub网站 新建vue.config.js文件 开始配置内容 // scss-resources-loader配置 module.exports = { chainWebpack: config => { const oneOfsMap = config...
sass-resources-loader
05-10
'sass-loader', { loader: 'sass-resources-loader', options: { resources: ['./path/to/variables.scss', './path/to/mixins.scss'], }, }, ], }, ], }, }; ``` 上述配置中，`sass-resources-loader` ...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值