您好,登錄后才能下訂單哦!
小編給大家分享一下vuejs怎么使用less,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
方法:1、安裝less依賴;2、修改“webpack.config.js”文件,配置loader加載依賴,讓其支持less;3、在需要的頁面中添加“<style scoped>less代碼</style>”語句即可。
本教程操作環境:windows7系統、vue2.9.6版,DELL G3電腦。
vuejs配置使用less
第一步:安裝less依賴,
npm install less less-loader --save
第二步:
修改webpack.config.js文件,配置loader加載依賴,讓其支持外部的less,在原來的代碼上添加
{ test: /\.less$/, loader: "style-loader!css-loader!less-loader", },
現在基本上已經安裝完成了
第三步:使用less
在使用的時候在style標簽里加上lang=”less”里面就可以寫less的代碼了
style標簽里加上 scoped 為只在此作用域 有效
<style lang="less" scoped></style> 或者@import './index.less'; //引入全局less文件
以上是“vuejs怎么使用less”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。