From: Kai Moritz Date: Tue, 27 Jun 2017 08:47:29 +0000 (+0200) Subject: WIP: less.js ausgebaut X-Git-Url: https://juplo.de/gitweb/?p=website;a=commitdiff_plain;h=7991acb8dcde417b83e4fbcca18fe4c52d610c4c WIP: less.js ausgebaut --- diff --git a/dist/thymeleaf/about.html b/dist/thymeleaf/about.html index 884c4bc2..16386539 100644 --- a/dist/thymeleaf/about.html +++ b/dist/thymeleaf/about.html @@ -9,9 +9,9 @@ About - - - + + + diff --git a/dist/thymeleaf/agb.html b/dist/thymeleaf/agb.html index 22a12b9c..22b3f0e7 100644 --- a/dist/thymeleaf/agb.html +++ b/dist/thymeleaf/agb.html @@ -9,9 +9,9 @@ Allgemeine Geschäftsbedingungen (AGB) - - - + + + diff --git a/dist/thymeleaf/blog.html b/dist/thymeleaf/blog.html index f61366d7..dfe18928 100644 --- a/dist/thymeleaf/blog.html +++ b/dist/thymeleaf/blog.html @@ -9,9 +9,9 @@ Blog - - - + + + diff --git a/dist/thymeleaf/blog/article.html b/dist/thymeleaf/blog/article.html index ff309e31..2873911f 100644 --- a/dist/thymeleaf/blog/article.html +++ b/dist/thymeleaf/blog/article.html @@ -9,9 +9,9 @@ juplo - blog - Combining jetty-maven-plugin and wro4j-maven-plugin for Dynamic Reloading of LESS-Resources - - - + + + @@ -25,18 +25,18 @@
-

Ever searched for a simple configuration, that lets you use your jetty-maven-plugin as you are used to, while working with LESS to simplify your stylesheets?

-

You cannot do both, use the Client-side mode of LESS to ease development and use the lesscss-maven-plugin to automatically compile the LESS-sources into CSS for production. That does not work, because your stylesheets must be linked in different ways if you are switching between the client-side mode – which is best for development – and the pre-compiled mode – which is best for production. For the client-side mode you need something like:

+

Ever searched for a simple configuration, that lets you use your jetty-maven-plugin as you are used to, while working with LESS to simplify your stylesheets?

+

You cannot do both, use the Client-side mode of LESS to ease development and use the lesscss-maven-plugin to automatically compile the LESS-sources into CSS for production. That does not work, because your stylesheets must be linked in different ways if you are switching between the client-side mode – which is best for development – and the pre-compiled mode – which is best for production. For the client-side mode you need something like:

   
-  <link rel="stylesheet/less" type="text/css" href="styles.less" />
+  <link rel="stylesheet" type="text/css" href="styles.css" />
   <script src="../less.js" type="text/javascript"></script>
   
           

While, for the pre-compiled mode, you want to link to your stylesheets as usual, with:

   
-  <link rel="stylesheet/less" type="text/css" href="styles.css" />
+  <link rel="stylesheet" type="text/css" href="styles.css" />
   
           

While looking for a solution to this dilemma, I stumbled accross wro4j. Originally intended, to speed up page-delivery by combining and minimizing multiple resources into one through the use of a servlet-filter, this tool also comes with a maven-plugin, that let you do the same offline, while compiling your webapp.

@@ -50,13 +50,13 @@ <groups xmlns="http://www.isdc.ro/wro"> <group name="base"> - <css>/less/base/*.less</css> + <css>/less/base/*.css</css> </group> -

wro4j looks for /less/base/*.less inside the root of the web-context, which is equal to src/main/webapp in a normal maven-project. There are other ways to specifie the resources, which enable you to store them elswhere. But this approach works best for our goal, because the path is understandable for both: the wro4j servlet-filter, we are configuring now for our development-environment, and the wro4j-maven-plugin, that we will configure later for build-time compilation.

+

wro4j looks for /less/base/*.css inside the root of the web-context, which is equal to src/main/webapp in a normal maven-project. There are other ways to specifie the resources, which enable you to store them elswhere. But this approach works best for our goal, because the path is understandable for both: the wro4j servlet-filter, we are configuring now for our development-environment, and the wro4j-maven-plugin, that we will configure later for build-time compilation.

wro.properties

-

wro.properties in short tells wro4j, how or if it should convert the combined sources and how it should behave. I am using the following configuration to tell wro4j, that it should convert *.less-sources into CSS and do that on every request:

+

wro.properties in short tells wro4j, how or if it should convert the combined sources and how it should behave. I am using the following configuration to tell wro4j, that it should convert *.css-sources into CSS and do that on every request:

   
   preProcessors=less4j
diff --git a/dist/thymeleaf/blog/comments.html b/dist/thymeleaf/blog/comments.html
index a15381b0..5f6f4c75 100644
--- a/dist/thymeleaf/blog/comments.html
+++ b/dist/thymeleaf/blog/comments.html
@@ -9,9 +9,9 @@
     juplo - blog - hibernate4-maven-plugin
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/contact.html b/dist/thymeleaf/contact.html
index 3e3a79fa..51c8d720 100644
--- a/dist/thymeleaf/contact.html
+++ b/dist/thymeleaf/contact.html
@@ -9,9 +9,9 @@
     Contact
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/datenschutz.html b/dist/thymeleaf/datenschutz.html
index d7976cf2..2b16711e 100644
--- a/dist/thymeleaf/datenschutz.html
+++ b/dist/thymeleaf/datenschutz.html
@@ -9,9 +9,9 @@
     Datenschutz
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/expertise.html b/dist/thymeleaf/expertise.html
index 84432621..0322b650 100644
--- a/dist/thymeleaf/expertise.html
+++ b/dist/thymeleaf/expertise.html
@@ -9,9 +9,9 @@
     Expertise
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/google-analytics.html b/dist/thymeleaf/google-analytics.html
index 01d1daec..e67c603c 100644
--- a/dist/thymeleaf/google-analytics.html
+++ b/dist/thymeleaf/google-analytics.html
@@ -9,9 +9,9 @@
     Google Analytics
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/haftung-inhalte.html b/dist/thymeleaf/haftung-inhalte.html
index 623ed5dd..c80281b5 100644
--- a/dist/thymeleaf/haftung-inhalte.html
+++ b/dist/thymeleaf/haftung-inhalte.html
@@ -9,9 +9,9 @@
     Haftung für Inhalte
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/haftung-links.html b/dist/thymeleaf/haftung-links.html
index 5746d136..ceb39ca7 100644
--- a/dist/thymeleaf/haftung-links.html
+++ b/dist/thymeleaf/haftung-links.html
@@ -9,9 +9,9 @@
     Haftung für Links
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/impressum.html b/dist/thymeleaf/impressum.html
index 28084f05..91446d7a 100644
--- a/dist/thymeleaf/impressum.html
+++ b/dist/thymeleaf/impressum.html
@@ -9,9 +9,9 @@
     Impressum
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/index.html b/dist/thymeleaf/index.html
index 7028f97c..c5efa6ba 100644
--- a/dist/thymeleaf/index.html
+++ b/dist/thymeleaf/index.html
@@ -9,9 +9,9 @@
     Home
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects.html b/dist/thymeleaf/projects.html
index ec79381c..a0416cf2 100644
--- a/dist/thymeleaf/projects.html
+++ b/dist/thymeleaf/projects.html
@@ -9,9 +9,9 @@
     Projects
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/accelerator.html b/dist/thymeleaf/projects/accelerator.html
index 3ff683b1..7cf00042 100644
--- a/dist/thymeleaf/projects/accelerator.html
+++ b/dist/thymeleaf/projects/accelerator.html
@@ -9,9 +9,9 @@
     
     
     Fix SWF - Overview
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/fix-swf/getting-started.html b/dist/thymeleaf/projects/fix-swf/getting-started.html
index 5548c53d..ba170637 100644
--- a/dist/thymeleaf/projects/fix-swf/getting-started.html
+++ b/dist/thymeleaf/projects/fix-swf/getting-started.html
@@ -9,9 +9,9 @@
     Fix SWF - Getting Started
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/fix-swf/overview.html b/dist/thymeleaf/projects/fix-swf/overview.html
index 67f13218..5bcc1542 100644
--- a/dist/thymeleaf/projects/fix-swf/overview.html
+++ b/dist/thymeleaf/projects/fix-swf/overview.html
@@ -9,9 +9,9 @@
     
     
     Fix SWF - Overview
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/html-experimente.html b/dist/thymeleaf/projects/html-experimente.html
index b0c11f77..892da3e3 100644
--- a/dist/thymeleaf/projects/html-experimente.html
+++ b/dist/thymeleaf/projects/html-experimente.html
@@ -10,9 +10,9 @@
     HTML-Experimente
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/html-experimente/basis-layout.html b/dist/thymeleaf/projects/html-experimente/basis-layout.html
index 2b58c361..57621001 100644
--- a/dist/thymeleaf/projects/html-experimente/basis-layout.html
+++ b/dist/thymeleaf/projects/html-experimente/basis-layout.html
@@ -9,7 +9,7 @@
   
     HTML-Experimente - Basis-Layout
     
-    
+    
     
   
   
diff --git a/dist/thymeleaf/projects/html-experimente/breadcrumb.html b/dist/thymeleaf/projects/html-experimente/breadcrumb.html
index 83395fed..e4c0549e 100644
--- a/dist/thymeleaf/projects/html-experimente/breadcrumb.html
+++ b/dist/thymeleaf/projects/html-experimente/breadcrumb.html
@@ -10,9 +10,9 @@
     HTML-Experimente - Langer Breadcrumb
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/html-experimente/druck-layout.html b/dist/thymeleaf/projects/html-experimente/druck-layout.html
index 59b19069..156f9160 100644
--- a/dist/thymeleaf/projects/html-experimente/druck-layout.html
+++ b/dist/thymeleaf/projects/html-experimente/druck-layout.html
@@ -9,8 +9,8 @@
   
     HTML-Experimente - Druck-Layout
     
-    
-    
+    
+    
     
   
   
diff --git a/dist/thymeleaf/projects/html-experimente/error.html b/dist/thymeleaf/projects/html-experimente/error.html
index d412dfd3..1961f7f3 100644
--- a/dist/thymeleaf/projects/html-experimente/error.html
+++ b/dist/thymeleaf/projects/html-experimente/error.html
@@ -7,9 +7,9 @@
   
     This Page Will Raise An Error
     
-    
-    
-    
+    
+    
+    
   
   
   
diff --git a/dist/thymeleaf/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html b/dist/thymeleaf/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html
index beb5fef2..22484bec 100644
--- a/dist/thymeleaf/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html
+++ b/dist/thymeleaf/projects/html-experimente/fast-leer-einspaltig-mit-marginalinhalt.html
@@ -10,9 +10,9 @@
     HTML-Experimente - Fast leere einspaltige Seite mit Marginalinhalt
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/html-experimente/fast-leer-einspaltig.html b/dist/thymeleaf/projects/html-experimente/fast-leer-einspaltig.html
index b574a96e..43743466 100644
--- a/dist/thymeleaf/projects/html-experimente/fast-leer-einspaltig.html
+++ b/dist/thymeleaf/projects/html-experimente/fast-leer-einspaltig.html
@@ -10,9 +10,9 @@
     HTML-Experimente - Fast leere einspaltige Seite
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git "a/dist/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274-aber-marginalinhalt.html" "b/dist/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274-aber-marginalinhalt.html"
index 66a5379f..3de8efb9 100644
--- "a/dist/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274-aber-marginalinhalt.html"
+++ "b/dist/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274-aber-marginalinhalt.html"
@@ -10,9 +10,9 @@
     HTML-Experimente - Fast leere Seite ohne Menü aber mit Marginalspalte
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git "a/dist/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274.html" "b/dist/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274.html"
index be3496dd..d6d88262 100644
--- "a/dist/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274.html"
+++ "b/dist/thymeleaf/projects/html-experimente/fast-leer-kein-men\303\274.html"
@@ -10,9 +10,9 @@
     HTML-Experimente - Fast leere Seite ohne Menü
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git "a/dist/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274-und-marginalinhalt.html" "b/dist/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274-und-marginalinhalt.html"
index 7b3601ce..cb177dbf 100644
--- "a/dist/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274-und-marginalinhalt.html"
+++ "b/dist/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274-und-marginalinhalt.html"
@@ -10,9 +10,9 @@
     HTML-Experimente - Fast leere Seite mit Menü und Marginalinhalt
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git "a/dist/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274.html" "b/dist/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274.html"
index c79ad909..8902bdd4 100644
--- "a/dist/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274.html"
+++ "b/dist/thymeleaf/projects/html-experimente/fast-leer-mit-men\303\274.html"
@@ -10,9 +10,9 @@
     HTML-Experimente - Fast leere Seite mit Menü
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/html-experimente/formulare.html b/dist/thymeleaf/projects/html-experimente/formulare.html
index bc7264dd..ab872e32 100644
--- a/dist/thymeleaf/projects/html-experimente/formulare.html
+++ b/dist/thymeleaf/projects/html-experimente/formulare.html
@@ -10,9 +10,9 @@
     HTML-Experimente - Formulare
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/html-experimente/phone.html b/dist/thymeleaf/projects/html-experimente/phone.html
index e088372a..64e7513f 100644
--- a/dist/thymeleaf/projects/html-experimente/phone.html
+++ b/dist/thymeleaf/projects/html-experimente/phone.html
@@ -9,8 +9,8 @@
   
     HTML-Experimente - Layout PHONE
     
-    
-    
+    
+    
     
   
   
diff --git a/dist/thymeleaf/projects/html-experimente/seitenaufteilung.html b/dist/thymeleaf/projects/html-experimente/seitenaufteilung.html
index 0a36ed6b..e03f9f63 100644
--- a/dist/thymeleaf/projects/html-experimente/seitenaufteilung.html
+++ b/dist/thymeleaf/projects/html-experimente/seitenaufteilung.html
@@ -9,8 +9,8 @@
   
     HTML-Experimente - Basis-Layout & Seitenaufteilung
     
-    
-    
+    
+    
     
   
   
diff --git a/dist/thymeleaf/projects/html-experimente/seitenkopf.html b/dist/thymeleaf/projects/html-experimente/seitenkopf.html
index 28ca8f22..b356cb64 100644
--- a/dist/thymeleaf/projects/html-experimente/seitenkopf.html
+++ b/dist/thymeleaf/projects/html-experimente/seitenkopf.html
@@ -9,8 +9,8 @@
   
     HTML-Experimente - Basis-Layout & Seitenkopf
     
-    
-    
+    
+    
     
   
   
diff --git a/dist/thymeleaf/projects/html-experimente/symbole.html b/dist/thymeleaf/projects/html-experimente/symbole.html
index e6cce9c1..0716c364 100644
--- a/dist/thymeleaf/projects/html-experimente/symbole.html
+++ b/dist/thymeleaf/projects/html-experimente/symbole.html
@@ -10,9 +10,9 @@
     HTML-Experimente - Symbol-Font
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/html-experimente/tablet.html b/dist/thymeleaf/projects/html-experimente/tablet.html
index ec048854..21842eb1 100644
--- a/dist/thymeleaf/projects/html-experimente/tablet.html
+++ b/dist/thymeleaf/projects/html-experimente/tablet.html
@@ -9,8 +9,8 @@
   
     HTML-Experimente - Layout TABLET
     
-    
-    
+    
+    
     
   
   
diff --git a/dist/thymeleaf/projects/html-experimente/testlab.html b/dist/thymeleaf/projects/html-experimente/testlab.html
index cdf2874b..fc5defc6 100644
--- a/dist/thymeleaf/projects/html-experimente/testlab.html
+++ b/dist/thymeleaf/projects/html-experimente/testlab.html
@@ -10,9 +10,9 @@
     HTML-Experimente - Media-Query-Test: BEISPIEL
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/projects/html-experimente/tiny.html b/dist/thymeleaf/projects/html-experimente/tiny.html
index c04f9fc9..fd5662bc 100644
--- a/dist/thymeleaf/projects/html-experimente/tiny.html
+++ b/dist/thymeleaf/projects/html-experimente/tiny.html
@@ -9,8 +9,8 @@
   
     HTML-Experimente - Layout TINY
     
-    
-    
+    
+    
     
   
   
diff --git a/dist/thymeleaf/projects/typo.html b/dist/thymeleaf/projects/typo.html
index a66a5bde..0ce26384 100644
--- a/dist/thymeleaf/projects/typo.html
+++ b/dist/thymeleaf/projects/typo.html
@@ -9,9 +9,9 @@
     Typography
     
     
-    
-    
-    
+    
+    
+    
     
     
     
diff --git a/dist/thymeleaf/references.html b/dist/thymeleaf/references.html
index b1f8a004..6424f667 100644
--- a/dist/thymeleaf/references.html
+++ b/dist/thymeleaf/references.html
@@ -9,9 +9,9 @@
     References
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/templates/404.html b/dist/thymeleaf/templates/404.html
index 5e49ca75..658f885e 100644
--- a/dist/thymeleaf/templates/404.html
+++ b/dist/thymeleaf/templates/404.html
@@ -9,9 +9,9 @@
     404: Page Not Found!
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/templates/error.html b/dist/thymeleaf/templates/error.html
index fc4c6afe..1e5a6c48 100644
--- a/dist/thymeleaf/templates/error.html
+++ b/dist/thymeleaf/templates/error.html
@@ -9,9 +9,9 @@
     An Unexpected Error Occured!
     
     
-    
-    
-    
+    
+    
+    
     
     
   
diff --git a/dist/thymeleaf/templates/fragments.html b/dist/thymeleaf/templates/fragments.html
index c5a23a01..3b668511 100644
--- a/dist/thymeleaf/templates/fragments.html
+++ b/dist/thymeleaf/templates/fragments.html
@@ -3,9 +3,9 @@
   
     Fragments
     
-    
-    
-    
+    
+    
+    
     
   
   
diff --git a/dist/thymeleaf/templates/layout.html b/dist/thymeleaf/templates/layout.html
index 3dc14a24..0b77b611 100644
--- a/dist/thymeleaf/templates/layout.html
+++ b/dist/thymeleaf/templates/layout.html
@@ -9,9 +9,9 @@
     juplo - BASISTEMPLATE
     
     
-    
-    
-    
+    
+    
+