在vue中如何引入外部less文件
更新時(shí)間：2022年09月23日 11:35:49 作者：曾曾子
這篇文章主要介紹了在vue中如何引入外部less文件，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
vue引入外部less文件
首先vue環(huán)境搭建成功
一、安裝 less 和less-loader
一、修改 webpack.config.js 文件，配置loader加載依賴，讓其支持外部的less,在原來的代碼上添加
{
test: /\.less$/,
loader: "style-loader!css-loader!less-loader",
},
安裝配置成功！！直接在需要的地方引入即可
vue引入lang=“less“報(bào)錯(cuò)的解決
想在vue中引入less,老是報(bào)錯(cuò)，百度良久，終于找到解決方案
一、安裝 less 和less-loader（npm install less less-loader --save）
二、修改webpack.base.conf.js文件
找到build文件夾下的webpack.base.conf.js文件，配置loader加載依賴，讓其支持外部的less,在原來的代碼上添加
{
test:/.less$/,
loader:“style-loader!css-loader!less-loader”
},如下圖：
三、使用lang=“less”
四、如果運(yùn)行還有問題，記得查看packjosn.js中‘less-loader’版本，如果過高，比如我一開始是版本8，執(zhí)行“npm uninstall less-loader”卸載‘less-loader’并重新安裝‘npm install less-loader@5.0.0’
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
Vue中data傳遞函數(shù)、props接收函數(shù)及slot傳參的使用及說明
這篇文章主要介紹了Vue中data傳遞函數(shù)、props接收函數(shù)及slot傳參的使用及說明，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章主要介紹了vue中 $emit的用法，通過實(shí)例代碼給大家介紹了子組件和父組件的相關(guān)知識(shí)，需要的朋友參考下吧2018-04-04
今天小編就為大家分享一篇vue初始化動(dòng)畫加載的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧2018-09-09
Vue是人氣爆棚且地表最強(qiáng)的JS（JavaScript）框架,祂允許我們構(gòu)建動(dòng)態(tài)交互式的Web App,然但是,和任何軟件雷同,Vue App偶爾會(huì)遭遇內(nèi)存泄漏,導(dǎo)致性能暴跌和意外行為,今天,我們將深入Vue App內(nèi)存泄漏的原因,并探討識(shí)別和修復(fù)這些問題的錦囊妙計(jì)2023-11-11
近期做的項(xiàng)目比較雜,涉及到前端框架的工作,遇到了許多問題,記錄一下這個(gè)比較棘手的問題,下面這篇文章主要給大家介紹了關(guān)于vue3中cookie的詳細(xì)使用方法,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-08-08
vue使用axios實(shí)現(xiàn)動(dòng)態(tài)追加數(shù)據(jù)
在vuejs中使用axios時(shí),有時(shí)候需要追加數(shù)據(jù),比如,移動(dòng)端下拉觸底加載,分頁加載,滑動(dòng)滾動(dòng)條等,下面小編就來為大家介紹一下如何使用使用axios實(shí)現(xiàn)動(dòng)態(tài)追加數(shù)據(jù)吧2023-10-10
Vue路由實(shí)現(xiàn)頁面跳轉(zhuǎn)的示例代碼
根據(jù)登錄的角色不一樣,實(shí)現(xiàn)不同的路由展示，文中通過示例代碼介紹的非常詳細(xì)，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2024-04-04
Element?Plus的el-tree-select組件懶加載+數(shù)據(jù)回顯詳解
el-tree-select組件是el-tree和el-select的結(jié)合體,他們的原始屬性未被更改,下面這篇文章主要給大家介紹了關(guān)于Element?Plus的el-tree-select組件懶加載+數(shù)據(jù)回顯的相關(guān)資料,需要的朋友可以參考下2022-11-11
這篇文章主要介紹了在pycharm中開發(fā)vue的方法步驟，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03
這篇文章主要介紹了vue中的select綁定多個(gè)值，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-09-09