привык писатьless/sass
, но сейчас разработки малых программ все равно не хватаетcss
, очень непривычно.
Учебники, которые искали в Интернете, либо gulp, либо vscode.Easy-less
плагин.
традиционный способ
Давайте сравним преимущества и недостатки этих двух методов.
Gulp
бывший кgulp
Есть простое понимание, но теперь оно работаетwebpack
Сказать,gulp
С меньшим количеством людей, но также имеет некоторые затраты на обучение, но хорошие новости от определения высокой степени, он может легко добавить взять.
Плагин без Esay для Vscodd
Ничего не говори, он очень ароматный, прямо вvscode
Установитьeasy-less
плагин, тоseting.json
, вы можете использовать его с удовольствиемless
охватывать
Сохраните его, и вы можете сгенерировать его в том же каталоге..wxss
файл, недостатком является то, что он должен бытьvscode
Другими словами, вам нужно открыть два редактора во время разработки и использовать их одновременно.vscode
Напишитеless
, во время использования инструмента разработчика WeChat, чтобы увидеть предварительный просмотр ... эммммм, картинка слишком красива, чтобы ее можно было представить
новый способ
Случайно увидел в сетиВы хотите использовать меньше в апплете? (версия VScode)Кто-то выложил скриншот
Easy-less используется непосредственно в инструменте разработчика WeChat, функция такая же, как и в vscode,
К моему удивлению, я побежал смотреть официальную документацию, оказалось, что инструменты разработчика WeChat начали поддерживать инструменты расширения еще в версии 1.03.2004271.
И вы можете напрямую использовать расширение vscode, что очень удобно
После ряда собственных операций это оказалось возможным.
шаг
- Установка Vscode Easy-less
- папка расширения
Его распакованную папку можно найти в ~/.vscode/extensions (системы macOS) или C:\Users\username.vscode\extensions (системы Microsoft Windows).
копироватьmrcrowl.easy-less-1.6.3
файл в инструменты разработчика WeChat
3. Вставьте папку расширения
Откройте Инструменты разработчика WeChat, верхняя панель, Настройки > Настройки расширения > Расширения > Пользовательские расширения.
Нажмите «Открыть папку расширения», после чего откроется папка, просто вставьте ее сюда.
- установить output.wxss
Последний шаг все еще здесь, потому что Easy-less, выходной css по умолчанию, но в апплете необходимо использовать файл .wxss, поэтому просто установите суффикс выходного файла.
- Перезапустите инструменты разработчика WeChat.
После успешной настройки закройте апплет и откройте его, а затем найдите страницу в каталоге pages, чтобы создать новую.index.less
, напишите немного CSS и сохраните егоindex.wxss
, ничего не изменилось...