屏蔽 Use :deep() instead.警告
  ltERVYe6WHLK 2023年11月02日 40 0

这个警告是由于 Vue 3 中的 Single File Component (SFC) 中的 >>>/deep/ 组合选择器已被废弃,建议使用 :deep() 代替。

这是因为 >>>/deep/ 在新的 CSS Shadow Parts API 标准中被弃用,而 :deep() 是 Vue 3 中的官方推荐替代方法。

如果确实想要屏蔽这个警告,可以在你的 Vue 项目中的相应配置文件中,将相关警告的输出禁用。以下是一些配置文件和方法:

  1. Vue CLI 项目:如果使用 Vue CLI 创建的项目,可以在项目的根目录中的 vue.config.js 文件中添加以下配置:
module.exports = {
  css: {
    // 屏蔽关于深度选择器的警告
    deep: {
      warning: false
    }
  }
};
  1. Vite 项目:如果使用 Vite,可以在你的 vite.config.js 文件中添加以下配置:
export default {
  css: {
    preprocessorOptions: {
      // 屏蔽关于深度选择器的警告
      scss: {
        additionalData: `@use "sass:meta"; @include meta.module-global();`
      }
    }
  }
};
  1. 手动在样式中使用 :deep():最佳的方法是将你的样式代码中的 >>>/deep/ 改写为 :deep(),以适应 Vue 3 的推荐方式。

需要注意的是,尽管可以屏蔽这个警告,但建议尽可能遵循 Vue 3 的最佳实践,并将样式更新为使用 :deep(),以便在未来避免问题。



【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年11月08日 0

暂无评论

推荐阅读
ltERVYe6WHLK