欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

React導(dǎo)入less及其注意事項(xiàng)說明

 更新時(shí)間：2024年11月08日 11:28:50   作者：帥氣的小蘇  
在Vite構(gòu)建的React項(xiàng)目中,直接安裝和導(dǎo)入Less即可使用,但需注意的是,Less的樣式作用域不局限于模塊內(nèi)部,可能造成樣式污染,建議通過修改文件名和導(dǎo)入方式來避免此問題

React導(dǎo)入less及注意事項(xiàng)

首先我們肯定要下載一下 less，這里我是用 vite 構(gòu)建的 react 項(xiàng)目，由于 vite 已經(jīng)內(nèi)置了對 less 配置，所以下載完直接導(dǎo)入就行

> npm i less

這時(shí)候我們就可以十分愉悅地使用 less 了嗎？

請看一個(gè)小例子

這里我創(chuàng)建了兩個(gè) tsx 模塊，分別為 computer 和 test，

在 computer 里，我引入了相應(yīng)的 computer 的 less，而 test 的 jsx 沒有

請?zhí)砑訄D片描述

并且將兩個(gè)模塊導(dǎo)入到 APP.

tsx，當(dāng)我們運(yùn)行項(xiàng)目的時(shí)候，發(fā)生了一些意想不到的情況，

我在 computer 模塊寫的樣式,為什么會在 test 模塊中出現(xiàn)呢。

從這里可以看出，computer 的 less 的作用域并沒限定在模塊之內(nèi)，而是造成了污染，

此時(shí)我們應(yīng)該這么做，將less的文件名改變成這樣

然后改變computer中的引入

這樣子就可以啦。

這里插一句，scss的導(dǎo)入也是一樣的.

總結(jié)

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論