Vemos paso a paso como configurar nuestro sublime text 2 para poder compilar código en Less.
Trabajando con Linux es difícil encontrar programas que nos ayuden a compilar el código que desarrollamos en Less (Para Win y Mac hay bastantes y muy buenos) por lo que me he tenido que instalar una serie de plugins en mi Sublime Text 2 para poder trabajar con Less de la forma más cómoda posible.
Vamos a partir de la base de que todos sabemos qué es Less, cómo funciona y qué se necesita para trabajar con él.
Además, vamos a dar por sentado que todos tenemos instalado Sublime Text, independientemente del sistema operativo con el que estemos trabajando, ya que solo hay una pequeña diferencia entre Windows y Linux, que veremos más adelante.
Una vez sentadas las bases para poder comenzar, nos queda solo ir explicando paso a paso, qué tenemos que hacer para poder compilar código .less desde nuestro sublime text 2.
Paso 1: Instalar Package Control
Supongo que todos sabemos ya lo que es Package control" y lo tenemos instalado, pero si no es así, es tan sencillo como abrir la consola de Sublime text (view → show console) y pegar el siguiente código:import urllib2,os; pf='Package Control.sublime-package'; ipp=sublime.installed_packages_path(); os.makedirs(ipp) if not os.path.exists(ipp) else None; urllib2.install_opener(urllib2.build_opener(urllib2.ProxyHandler())); open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read()); print('Please restart Sublime Text to finish installation')
Sólo nos falta reiniciar el Sublime text 2 para tener instalado Package Control.
Paso 2: Instalación de plugins necesarios
Para instalar plugins tan sólo tenemos que ir a "Preferences → Package Control → Install Packages".Nos saldrá un listado de todos los plugins que podemos instalar, buscaremos e instalaremos los siguientes plugins en el siguiente orden:
- LESS
- LESS build
- SublimeOnSaveBuild
- less2css
Paso 3: Compilar los .less
Para compilar un archivo .less no necesitamos nada más que guardar nuestro archivo, automáticamente sublime lo compilará y creara un .css con el mismo nombre que el archivo .less en la misma carpeta donde se encuentra el archivo .less.
sudo apt-get install node-less
Mientras que en Windows la única solución es desinstalar todo y volver a repetir todo el proceso (investigando he visto que a veces se soluciona de esta forma)... aunque es raro que os de este error en windows.
Además, me gustaría comentar, aunque creo que ya lo sabéis si estáis trabajando con Less que si tenéis varios archivos .less que se llaman entre sí, siempre debéis compilar el principal, el que llama al resto, para que se cree bien la compilación y no os de errores del tipo de que no esta definida una variable, etc. y no compile Sublime.