magento2 如何除錯LESS?

2021-09-19 08:13:12 字數 880 閱讀 2568

magento2內建lessphp,在developer模式下會自動編譯less。然而並沒有用,如果less寫錯了會導致lessphp編譯失敗,而且不會提示你已經失敗,你只會看到亂成一團的頁面。另外lessphp並不會加source map定位資訊,在頁面上看到的css無法追蹤對應的less**,對於前端來說,不能定位就相當於無法工作。那就只有使用grunt來編譯less,如果已經安裝了nodejs,使用以下**部署grunt

npm install -g grunt-cli

npm install

如果你使用自己的主題,你還需要在grunt的配置檔案裡追加less的配置

// dev/tools/grunt/configs/themes.js

mytheme:

然後使用以下**可進行less編譯

grunt clean:var

grunt deploy

grunt exec:mytheme

grunt less:mytheme

完成以上過程,可以在瀏覽器的偵錯程式裡看到less的定位。deploy時間相當漫長,幸好以後每次修改less只需要執行一次grunt less:mytheme,就可以看到修改效果。

以下是有less定位的效果

grunt clean:var // 刪除var/下的快取檔案

grunt less:mytheme // pub下所有less編譯為css

參考:

Magento2 如何設定首頁內容

初次接觸magento2的小夥伴,在 搭建完畢之後,不知道如何設定 首頁內容,下面由萬博雲計算來為大家講解一下如何設定首頁內容 對於乙個電商 來說,首頁會有千萬種變化,不可能有統一格式,所以magento2的首頁採用了cms page 靜態頁 想要改變首頁的內容,就要找到對應的cms page,然後...

magento2常見命令

magento2常見命令 在magento2中我們經常會用到php bin magento 命令 引數 來完成一些操作,所以就對命令做了乙個總結 常見的命令如下 php bin magento list 檢視所有命令列表 moudule相關的引數 1 moudule status 檢視所有modul...

Magento2模式設定

magento有三種執行模式,按效能由低到高,依次為 developer default production 可以使用以下命令檢視當前執行模式 bin magento deploy mode show使用以下命令設定執行模式 bin magento deploy mode set develope...