acdvorak / intellij-lessc-plugin

LESS CSS compiler plugin for the JetBrains IntelliJ platform (IntelliJ IDEA 11+, PhpStorm 5+, WebStorm 5+, RubyMine 4.5+)
http://plugins.jetbrains.com/plugin?pr=&pluginId=7059
75 stars 26 forks source link

Make plugin generic and language-agnostic #31

Open acdvorak opened 11 years ago

acdvorak commented 11 years ago

Separate out the core logic and behavior and move language-specific code into pluggable modules. This will allow additional languages to take advantage of this plugin's architecture: e.g., Jade and SASS.

acdvorak commented 11 years ago

@nstawski commented:

Offtopic question — do you by any chance plan to make a similar plugin for jade? (http://jade-lang.com/)

I wasn't even aware that you could pre-compile Jade templates. I'll have to look into that for client-side templating as a possible alternative to Handlebars.

To be honest, I only wrote this plugin to scratch a personal itch. Back in June 2012 there weren't many solutions for automatically compiling LESS to CSS, and frankly the ones that were available sucked (I loved SimpLESS, but v1.3 was just too... well, simple... and lacked many of the features that were thankfully added in v1.4). I use LESS very heavily so not having a decent auto-compiler was extremely painful, which is what drove me to finally write my own IntelliJ plugin. Since I don't use Jade very much, there's not a lot of motivation for me to write a plugin for it.

That said, the architecture of the LESS Compiler plugin is actually quite generic and language-agnostic. It shouldn't be too hard to separate out the core logic and behavior - file watcher, compile manager, preference pane UI, and notifications - and make the language-specific code pluggable.

As my experience with Jade is rather limited, could you possibly share some typical use cases so I can get a better idea of what your workflow is like w/ Jade?

nstawski commented 11 years ago

I can tell you how I use Jade. I started using it with Node.js, but now it's a kind of separate, because, as LESS, it can be compiled simple enough.

The simplest thing you can do is just run "jade < my.jade > my.html", and you'll get an html page out of jade.

This is quite tiring, so there are two ways I am compiling it now.

1) With PyCharm, I used the External Tools menu, and added a 'JADE to HTML' tool. It uses jade location for program (/opt/local/bin/jade in my case), and parameters are -P -O $ProjectFileDir$ $FileDir$/$FileName$

-P is prettify, and -O is output to a directory.

2) Using Watch and a Makefile, which probably would be helpful for your case. Here is the makefile:

JADE = $(shell find jade/*.jade ! -name 'layout.jade') // I need to skip some files I don't want to be translated HTML = $(patsubst jade/%.jade, %.html, $(JADE)) // I need to output files into a different directory

all: $(HTML)

%.html: jade/%.jade jade < $< --out $< --path $< --pretty > $@

clean: rm -f $(HTML) // I don't usually need that, but sometimes it's helpful

.PHONY: clean


So, basic idea is the same as with LESS. You have a sources directory and the files/folders you want to ignore (don't compile includes, don't compile the layout template, etc. depending on situation) Then you have a destination directory, it may be different from your source, and you want your sources to compile on filechange (I do it with 'watch make' right now).

Hope this helps.

acdvorak commented 11 years ago

Thanks for the detailed writeup! I'll keep this in mind as I refactor the code.