vue项目使用deep语法报错并且无法启动项目最佳最完美解决方案

最新推荐文章于 2024-08-04 09:42:22 发布
最新推荐文章于 2024-08-04 09:42:22 发布
阅读量1.1w 收藏 29
点赞数 11
分类专栏： 前端 html 文章标签： vue.js sass 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_67401055/article/details/123373535
版权
在vue项目中，使用/deep/进行样式穿透时遇到报错，作者发现这个问题在2020年开始普遍出现。常见的解决办法是使用::v-deep替代，但会导致scss嵌套写法失效。为了解决这个问题，作者尝试降低sass-loader版本到7.0.0，通过卸载现有版本并安装指定版本，解决了报错，同时保留了scss的嵌套写法，使/deep/再次正常工作。
摘要由CSDN通过智能技术生成

vue项目使用/deep/语法报错

最近使用vue创建后台管理系统，在改变饿了么组件样式时，使用/deep/样式穿透 压根不生效，而且终端还会报错，之前可是可以随便用/deep/的，一下子就给整懵逼了~，先来看看报错信息长啥样：在这里插入图片描述
然后当你去各种百度会发现遇到同样问题的人还挺多，而且绝大多数出现的时间都是在2020年期间开始很多人出现这类问题：在这里插入图片描述

然后最多的答案无非就是使用::v-/deep/ 来替换/deep/，确实有效，但是会不能使用scss嵌套写法的问题，不然样式嵌套的子元素样式不会生效如图：
在这里插入图片描述
所以只能这样写
在这里插入图片描述
然后心里一句草泥马路过~本来sass就是为了嵌套写法，提

最低0.47元/天 解锁文章
及时机芯
关注
专栏目录
uniapp - 项目运行/打包编译/分包报错 TypeError: Cannot read property call of undefined，uni-app控制台出现一堆这种报错（详细解决方法）
高级前端工程师
05-20 5484
uni-app，TypeError: Cannot read property call of undefined，报错，安卓app，苹果app，微信小程序，移动端，H5网页，手机网站，微信小程序、支付宝小程序，手机app端，nvue，微信小程序分包报错，uniApp小程序平台分包失败怎么办，uniapp运行编译报错解决方案，UniApp移动端网页控制台报错，详细解决办法，清缓存重新编译，热重载，开启压缩代码还是不行怎么办，刷新或者重启一下又好了，过一会又开始报错，vue，分包，小程序分包，支付宝小程序分包
vue使用篇----deep深度编译器引起的报错问题解决
无痕坚守本心的博客
05-25 1361
目录Sass安装报错可采用降级方法使用深度编译器deep报错可采用替换方法解决方法 Sass安装报错可采用降级方法 如若出现以下报错，可尝试变更package.json文件中的"node-sass"为"sass": "^1.26.5" 保持"sass-loader": "^10.1.1"依赖或其他较新的版本 再进行npm install 使用深度编译器deep报错可采用替换方法 vue使⽤scss的style scoped时,若使⽤/deep/或类似格式的深度选择器的时候可能会引起如下报
vue项目使用deep语法报错并且无法启动项目（解决方案）
zhj1329000的博客
06-07 4047
vue使用elementui，使用/deep/穿透样式时会报错问题
Vue项目/deep/ 深选择器版本不兼容报错
weixin_63729549的博客
07-11 407
Sass（Syntactically Awesome Stylesheets）是一种CSS预处理器，它扩展了CSS语言，增加了诸如变量、嵌套规则、混合（mixins）、继承、函数等功能，使得编写CSS变得更加高效和有组织性。深选择器在Web开发中主要用于穿透组件的 Scoped CSS 层次，以达到修改子组件样式的目的。深选择器的主要用途是在保持组件样式封装的同时，允许外部组件对内部元素的样式进行一定的定制或覆盖，这对于复杂的UI组件库尤其有用。，它是Vue推荐的写法，并且在Sass环境下也能正常编译。
vue使用/deep/报错
weixin_53215201的博客
03-13 653
vue使用/deep/报错
vue中/deep/报错问题
weixin_72459765的博客
10-21 301
vue中/deep/的报错问题
vue 深度选择器/deep/报错（标红）
自律遇到更好的自己！！
07-20 378
在vue进行页面开发过程中，为了更改组件原本的样式，写出这样的代码，会出现爆红的情况的情况：大多数的要修改元素都是在标签下的，换一下的下的写法，完美解决：
/deep/报错 v-deep无效
10-01
当使用/deep/语法出现报错并且修改成::v-deep后样式未渲染出来时，可能是因为/deep/语法被废弃了。在Vue 2.6版本之后，推荐使用::v-deep或者>>>来替代/deep/。如果修改成::v-deep后仍然没有渲染出来，可以尝试以下...
vue框架使用
qq_45645848的博客
01-11 1170
前端vue基础知识总结，汇总
Vue.js 笔记
Mr__Zhang___的博客
11-03 383
1 就是四个现代化： ① 模块化（JS 的模块化、CSS 的模块化、资源的模块化） ② 组件化（复用现有的 UI 结构、样式、行为) ③ 规范化（目录结构的划分、编码规范化、接口规范化、文档规范化、Git分支管理) ④ 自动化（自动化构建、自动部署、自动化测试) 2 目前主流的前端工程化解决方法： ① webpack
vue遇见/deep/报错
tt010175的博客
08-24 758
今天使用/deep/来覆盖element ui样式报错 解决:将/deep/ 替换成::v-deep
解决vue项目中使用/deep/报错
tuantaun_的博客
04-18 1699
方法：降低sass-loader版本 1.卸载当前项目中的sass-loader npm uninstall sass-loader 2.安装低版本sass-loader npm install sass-loader@7.0.0 3.安装node-sass npm install node-sass 安装node-sass是因为安装低版本sass-loader需要引入node-sass依赖来支持，不然会报错（如下图） ...
vue项目使用/deep/语法报错并且无法启动项目最佳最完美解决方案
热门推荐
qq_45674727的博客
01-14 2万+
vue项目使用/deep/语法报错并且无法启动项目，最佳解决方式还在各种百度？找了半天也没找到答案？看我这里你就找对地方咯~~ 还在各种百度？找了半天也没找到答案？看我这里你就找对地方咯~~ 最近使用vue创建后台管理系统，在改变饿了么组件样式时，使用/deep/样式穿透 压根不生效，而且终端还会报错，之前可是可以随便用/deep/的，一下子就给整懵逼了~： 然后当你去各种百度会发现遇到同样问题的人还挺多，而且绝大多数出现的时间都是在2020年期间开始很多人出现这类问题： 然后最多的答案无非就是使用::v-
vue 深度选择器 /deep/ 报错
sinat_38914900的博客
08-14 1115
当在scope样式中使用/deep/飘红报错时，可以使用::v-deep代替。 <style lang="less" scoped> ::v-deep { .overlay { position: absolute; } } </style> 这和/deep/是一样的效果。
用深度选择器＞＞＞ （ /deep/ ）解决vue调用第三方组件库覆盖样式不生效问题
反手一个bug的博客
10-19 1360
前言     在使用vue构建项目的时候，引用了第三方组件库，只需要在当前页面修改第三方组件库的样式以做到不污染全局样式。通过在样式标签上使用scoped达到样式只制作用到本页面，但是此时再修改组件样式不起作用。 scoped的实现原理     vue中的scoped属性的效果主要通过PostCSS转译实现，如下是转译 前的vue代码： <style scoped> .example { color:
Vue项目使用/deep/报错：SassError: expected selector解决方案--亲测有效
wwyxjjz的博客
09-29 5229
项目npm run dev报错如下： 解决方法： 尝试用 ::v-deep 替换 /deep/ ，成功解决了问题。 效果如下图所示(完美解决~) 某些预处理器(例如Sass)可能无法>>>正确解析。 在这些情况下，可以用/deep/ 如果/deep/报错，可以使用::v-deep 组合器-两者都是它们的别名，>>> 并且工作原理完全相同。 用法和/deep......
vue3使用::v-deep深度选择器不生效
最新发布
DN金猿的博客
08-04 693
会出现 ::v-deep usage as a combinator has been deprecated. Use :deep() instead of ::v-deep .的报错。：：v-depth用作组合子已被弃用。使用：deep（＜内部选择器＞）而不是：：v-deep＜内部选择器>。需要改成:deep(class),示例代码如下。
vue项目/deep/报错
02-03
当您在Vue项目中遇到报错时，可以尝试以下步骤来解决问题： 1. 首先，查看报错信息。报错信息通常会提供一些关键的线索，帮助您定位问题所在。请确保仔细阅读报错信息，并理解其中的错误提示。 2. 检查代码。根据...
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值