生活随笔
收集整理的這篇文章主要介紹了
scoped 样式
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
一、加不加 scoped ？
加上之后，讓樣式在局部生效，防止沖突
<style lang="less" scoped>
#bg-red {background-color: #f00;
}
</style>
不加，相當于是定義的全局樣式，每個組件都可以訪問你定義的樣式在 App.vue 的樣式屬性中就沒有 scoped ，因為每個組件都要匯總到 App.vue 中，每個組件都可以訪問 App.vue 上定的類樣式
<style lang="less">
.bg-yellow {color: #f00;background-color: #ff0;
}
</style>
解決 vue 使用 less 版本問題
npm view less-loader versions 查看 less-loader 的歷史版本
npm i less-loader@7 -- 安裝 less-loader 7 版本
vue 使用的是 wabpack 4.46， less 7.x.x 支持； 而 less 9.x.x 是支持 webpack 5 的，所以要降版本使用
樣式屬性沒有指出語言 – lang=“xxx” 默認就是 css
總結
以上是生活随笔為你收集整理的scoped 样式的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
