Use locally installed npm deps

.php-cs-fixer.dist.php

@@ -7,7 +7,7 @@ $finder = Finder::create()
     ->in([__DIR__])
     ->exclude([
         'node_modules',
-        'vendor'
+        'vendor',
     ])
     ->ignoreDotFiles(false)
     ->name('*.php.dist')

INSTALL

@@ -45,6 +45,7 @@ INSTALLATION
       section (remove the explanation texts after the version!).
     - run `php composer.phar update --no-dev`
   2.2. Install Javascript dependencies by executing `bin/install-jsdeps.sh` script.
+  2.3. Install some developer tools by executing `npm install`.
 3. Make sure that the following directories (and the files within)
    are writable by the webserver
    - /temp

Makefile

@@ -61,9 +61,9 @@ roundcubemail-git: buildtools
 	git clone --branch=$(GITBRANCH) --depth=1 $(GITREMOTE) roundcubemail-git
 	(cd roundcubemail-git; bin/jsshrink.sh; bin/updatecss.sh; bin/cssshrink.sh)
 	(cd roundcubemail-git/skins/elastic; \
-		../../node_modules/.bin/lessc --clean-css="--s1 --advanced" styles/styles.less > styles/styles.min.css; \
-		../../node_modules/.bin/lessc --clean-css="--s1 --advanced" styles/print.less > styles/print.min.css; \
-		../../node_modules/.bin/lessc --clean-css="--s1 --advanced" styles/embed.less > styles/embed.min.css)
+		npx lessc --clean-css="--s1 --advanced" styles/styles.less > styles/styles.min.css; \
+		npx lessc --clean-css="--s1 --advanced" styles/print.less > styles/print.min.css; \
+		npx lessc --clean-css="--s1 --advanced" styles/embed.less > styles/embed.min.css)
 	(cd roundcubemail-git/bin; rm -f transifexpull.sh package2composer.sh)
 	(cd roundcubemail-git; find . -name '.gitignore' | xargs rm -f)
 	(cd roundcubemail-git; find . -name '.travis.yml' | xargs rm -f)

UPGRADING

@@ -58,7 +58,8 @@ it on a unix system, you need to do the following operations by hand:
    - run `php composer.phar update --no-dev`.
 4c. If you use git sources or the release package without dependencies
    update javascript dependencies by executing `bin/install-jsdeps.sh` script.
-4d. If you use git sources, compile css files for the Elastic skin as described
+4d. If you use git sources, install developer tools using `npm install`.
+4e. If you use git sources, compile css files for the Elastic skin as described
    in the skins/elastic/README.md file.
 5. Run `./bin/update.sh` from the commandline OR
    open http://url-to-roundcube/installer/ in a browser and choose "3 Test config".

bin/cssshrink.sh

@@ -1,18 +1,21 @@
 #!/bin/sh
 
+PWD=`dirname "$0"`
+BIN=`which csso`
+
 set -e
 
-PWD=`dirname "$0"`
+if [ -e "$PWD/../node_modules/.bin/csso" ]; then
+    BIN="$PWD/../node_modules/.bin/csso"
+fi
 
 do_shrink() {
     rm -f "$2"
-    csso $1 -o $2 --no-restructure
+    $BIN $1 -o $2 --no-restructure
 }
 
-if which csso > /dev/null 2>&1; then
-    :
-else
-    echo "csso not found. Please install e.g. 'npm install -g csso-cli'."
+if [ -z "$BIN" ]; then
+    echo "csso not found. Please run 'npm install'."
     exit 1
 fi
 

bin/jsshrink.sh

@@ -1,21 +1,23 @@
 #!/bin/sh
 
-set -e
-
 PWD=`dirname "$0"`
 LANG_IN='ECMASCRIPT5'
+BIN=`which uglifyjs`
+if [ -e "$PWD/../node_modules/.bin/uglifyjs" ]; then
+    BIN="$PWD/../node_modules/.bin/uglifyjs"
+fi
+
+set -e
 
 do_shrink() {
     rm -f "$2"
     # copy the first comment block with license information for LibreJS
     grep -q '@lic' $1 && sed -n '/\/\*/,/\*\// { p; /\*\//q; }' $1 > $2
-    uglifyjs --compress --mangle -- $1 >> $2
+    $BIN --compress --mangle -- $1 >> $2
 }
 
-if which uglifyjs > /dev/null 2>&1; then
-    :
-else
-    echo "uglifyjs not found. Please install e.g. 'npm install -g uglify-js'."
+if [ -z "$BIN" ]; then
+    echo "uglifyjs not found. Please run 'npm install'."
     exit 1
 fi
 

skins/elastic/README.md

@@ -28,15 +28,12 @@ INSTALLATION
 ------------
 
 All styles are written using LESS syntax. Thus it needs to be compiled
-using the `lessc` (>= 2.5.2) command line tool. This comes with the `nodejs-less`
-RPM package or using `npm install less` which depend on nodejs.
+using the `lessc` command line tool (that you can install with `npm install`).
 ```
-    $ lessc --clean-css="--s1 --advanced" styles/styles.less > styles/styles.min.css
-    $ lessc --clean-css="--s1 --advanced" styles/print.less > styles/print.min.css
-    $ lessc --clean-css="--s1 --advanced" styles/embed.less > styles/embed.min.css
+    $ npx lessc --clean-css="--s1 --advanced" styles/styles.less > styles/styles.min.css
+    $ npx lessc --clean-css="--s1 --advanced" styles/print.less > styles/print.min.css
+    $ npx lessc --clean-css="--s1 --advanced" styles/embed.less > styles/embed.min.css
 ```
-(`--clean-css="--s1 --advanced"` minifies the css, requires the clean-css Less plugin.
-The plugin can be installed using `npm install less-plugin-clean-css`)
 
 References to image files from the included CSS files can be appended
 with cache-buster marks to avoid browser caching issues after updating.