Eclipse plugin for LESS

(Désolé, cette page n'est disponible qu'en Anglais.)

Overview

LESS is a language which extends CSS with dynamic behavior such as variables, mixins, operations and functions. This plugin extends the Eclipse IDE by providing handy features to edit and compile LESS stylesheets.

Syntax coloring

Syntax is automatically colored in the LESS editor as you type.

Outline view

The outline view provides an overview of your style sheet, and an easy access to its components.

Content assist

Press CTRL+space to get a context relevant list of completion proposals for CSS properties and variable names.

Errors and warnings

Potential errors in your stylesheet are detected in background and signaled by problem markers.

Variable and Mixin linking

Variable and mixin uses are automatically linked to their definition, allowing navigation and detection of undefined names.

Launch the LESS compiler

Create launch configurations for LESS stylesheets, and run them directly from their contextual menu.

Jump to the next error and fix it

The error messages of the LESS compiler are directly provided in the Eclipse IDE, with hyperlinks to the source stylesheet.

Installation

Requirements

The Eclipse LESS plugin should run on all platforms where Eclipse and LESS are supported.

Step 1: Install Base Software

In order to use the Eclipse LESS plugin, you need:

• Eclipse Indigo (version 3.7.1 or later). You can download it from the Eclipse website. We recommend you install the package called Eclipse IDE for Java EE Developers.
• The LESS compiler (if you want to compile your stylesheets in CSS), version 1.1.5 or further. You can download it there.

Step 2: Install Xtext

The Eclipse LESS plugin is built on top of Xtext, a framework for handling Domain Specific Languages in Eclipse. In order to install it:

• Run Eclipse.
• Open the update manager (menu Help, then Install new software...).
• In the field Work with:, enter the URL of the Xtext update site: http://download.eclipse.org/modeling/tmf/xtext/updates/composite/releases/
• Select the latest available version of TMF Xtext (should be 2.2.1 or later).
• Click on Next and validate the following messages to finalize the installation.
• At the end of the installation, Eclipse proposes you to restart Eclipse for the installation to take effect. You may answer Not Now, as we will restart at the end of step 3.

Full installation instructions are available on the Xtext website.

Step 3: Install the plugin

• Open again the update manager (menu Help, then Install new software...).
• In the field Work with:, enter the URL of the update site: http://www.normalesup.org/~simonet/soft/ow/update/
• Select the LESS plugin.
• Click on Next and validate the following messages to finalize the installation.
• During the installation, Eclipe will show a security warning. You need to acknowledge it.
• At the end of the installation, Eclipse proposes you to restart Eclipse for the installation to take effect. You should accept by clicking on Restart Now.

How to use it?

Once you have installed the plugin, you just need to create a file with the file extension .less in any project. This file will automatically be opened with the LESS editor.

You may register additional file extensions for LESS stylesheets in the Eclipse Preferences (menu Window, then Preferences...), section General > Content Types.

You can disable some errors/warnings on a per-project warning, by editing the project properties (tab Validation > LESS.

In order to launch the LESS compiler from Eclipse, you need to create a launch configuration. For this:

• In the menu Run, select Run Configurations...
• Select LESS Compiler in the list on the left hand side of the dialog, then click on the icon to create a new launch configuration at the top of this list,
• Configure the options to run the LESS compiler (in particular the LESS command if lessc is not in your system path) and check the option Use this launch configuration as default.

Once this is done, you may compile any LESS stylesheet by selecting it in the project explorer, clicking on the right button to open the contextual menu and selecting Run as, LESS Compiler. This will use the default launch configuration you just created. You can also create specific launch configurations for each of your stylesheet.

License

The Eclipse LESS plugin is distributed under the Eclipse Plublic License Version 1.0.

It includes some files from the Eclipse Webtools Project. These files are also distributed under the Eclipse Public License Version 1.0.

History

• Version 1.0.16 (2013-04-11):
  • Issue #129: Support of @keyframes statements.
  • Issue #134: Move project property page under Validation.
  • Issue #135: Allow disabling of error messages for undefined variables and mixins.
  • Issue #136: Support of @viewport statements.
• Version 1.0.15 (2013-04-01):
  • Issue #117: Support for named parameters in mixin calls. This version also includes fixes for issues #124, #128 and #130 detected on the beta-version.
  • Issue #121: Support semicolons as separator between mixin parameters.
  • Issue #123: Fix various errors in parsing of LESSHat file.
• Version 1.0.14 (2013-03-10):
  • Issue #111: Make some warnings and errors configurable through project properties.
  • Issue #112: Priorty (!important) on mixin calls.
  • Issue #113: @import statements with a file extension containing digits.
  • Issue #116: Anomymous collector mixin parameters.
  • Issue #118: Variables in media queries.
  • Issue #119: Parsing of < in mixin guards.
  • Issue #120: Fixing bug in parisong of some pseudo-class arguments.
  • Issue #122: Variables as pseudo-class arguments.
• Version 1.0.13 (2013-01-01):
  • Issue #101: New dimension units.
  • Issue #105: @import-once and @import-multiple.
  • Issue #106: Variable length arguments in mixins.
  • Issue #107: Variables in selectors.
  • Issue #109: Top-level mixin calls.
• Version 1.0.12 (2012-10-27):
  • Issue #65: Ignore import statements with non-file URIs.
• Version 1.0.11 (2012-10-14):
  • Issue #76: Support nested @media, @page, @font-face and @charset statements within.
  • Issue #90: Change of syntax coloring preferences does no longer require restarting Eclipse.
• Version 1.0.10 (2012-08-11):
  • Compatibility with Eclipse 4.
• Version 1.0.9 (2012-06-16):
  • Issue #48: Syntax coloring for numeric literals (disabled by default, can be enabled in editor's preferences).
• Version 1.0.7 (2012-05-28):
  • Issue #52: Escape sequences in identifiers.
  • Issue #55: Escape sequences in strings.
• Version 1.0.6 (2012-05-19):
  • Issue #35: Make launch configurations suitable for running under Windows.
  • Issue #36: Fix null pointer exception when browsing a file with unknown content-type in the launch configuration.
  • Issue #38: Better syntax coloring of mixin declarations, mixin calls and variable uses.
  • Issue #46: Fix error messages for undefined mixins.
  • Issue #47: Allow comma-separated terms in variable definitions.
  • Supporting new command-line options of the LESS compiler.
• Version 1.0.5 (2012-05-04):
  • Issue #25: First version of the code formatter.
  • Issue #29: Distinguishing CSS from LESS stylesheets in import statements.
  • Issue #30: Parsing of the special variable @arguments.
  • Implementing some new features from the LESS language (mixin guards).
• Version 1.0.4 (2012-04-22):
  • Issue #26: correct parsing of mixin parameters with several terms.
• Version 1.0.3 (2012-04-11):
  • Issue #24: Compatibility issue with Java 5.
• Version 1.0.2 (2012-04-04):
  • CSS3 selectors and media queries,
  • Cross-references between files.
• Version 1.0.1 (2012-03-08):
  • Issue #4: better handling of & in selectors.
  • Issue #5: handling of the star-property-hack.
• Version 1.0.0: First release.

Known issues

The following constructs of the LESS language are not (yet) supported:

• CSS escapes (css-escapes.less)
• Empty property values (css.less)
• Special case of the font: property
• Mixin matching based on number of arguments

The following features are not supported in the editor:

• Refactoring.