sobota 1. srpna 2020

Neseriózní Less.js v prohlížeči

Bez css preprocesoru jako je Less.js si dnes snad ani seriózní webařinu nedokážeme představit. Při normální seriózní práci si také neumíme představit, že by se kompilace less nespustila při buildu (nebo tak nějak jako podobně, prostě "pre-").

Ale občas se hodí zcela neseriózně zpracovat less v prohlížeči, třeba když připravujete jen takovou stránečku třeba pro náhled ikon, nebo tak něco, a chcete použít fragment stylů projektu v less. Není to žádný problém.

Podle Using Less.js - Browser Usage | Less.js potažmo less-docs/using-less-in-the-browser.md at master · less/less-docs · GitHub či LESS - Using Less In The Browser - Tutorialspoint a less.js - cdnjs.com - The best FOSS CDN for web related libraries to speed up your websites! necháme natáhnout script, případně doplníme konfiguraci, a podle css - Is it possible to inline LESS stylesheets? - Stack Overflow upravíme type, protože při naší neserióznosti máme styly přímo v html. Script pak musí být natažen až za styly! Výsledný kód pak bude vypadat nějak takto:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <style>
        /* css */
    </style>
    <style type="text/less">
        /* less */
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/less.js/3.12.2/less.min.js"></script>
</head>
<body>
    <!-- obsah -->
</body>
</html>


MAKE Magazine

Technology Review RSS Feeds

Nejčtenější příspěvky