I want to have files with a .less extension use the CSS syntax highlighting in NetBeans, and I don't have any clue how to do this.
I found a rather time consuming way to do this (http://netbeans.dzone.com/tips/quickstart-guide-language-supp), but it hit me that it must be easier way to do this.
Anyone knows?
You just have to add a new file type in Netbeans > Tools > Options > Miscellaneous > Files. Note that Netbeans will mark as errors some less features like variables...etc
a module which adds full less highlighting support can be downloaded from the following page:
http://plugins.netbeans.org/plugin/32782/lesscss-module
i tested the module with netbeans 7.0 and it worked flawless.
You might try out the new version of the plugin that was already mentioned:
http://plugins.netbeans.org/plugin/41315/lesscss-module
Github repository, now gone, was available at:
https://github.com/khairie/lesscss-module
For me it seems to work quite fine despite some minor bugs in coloring. It is missing some features and e.g. does not offer automatic formatting, though.
Note that basic editing support for Sassy CSS and LESS CSS preprocessor files has been added to Netbeans dev build:
http://wiki.netbeans.org/NewAndNoteWorthy
The SCSS Support plugin also works with less files, just need to add the "less" file extension with text/x-scss MIME in Tools/Options/Miscellaneous/Files.
Since Netbeans 7.4 less is supported by Netbeans without the need for an additional plugin.
For older version of Netbeans there are two plugins:
http://plugins.netbeans.org/plugin/32782/lesscss-module
and http://plugins.netbeans.org/plugin/41315/lesscss-module
Related
When I was studying Multimedia I got a free copy of PhpStorm.
Using PhpStorm I managed to some techincal magic using Ruby(I can't exactly remember how it worked) to write code in SCSS and phpstorm would automatically create a new file and compile all my code to usable CSS code.
I believe I remember something about a 'filewatcher' but im not sure.
Is there any way to do the same in Brackets?
maybe an addon to Brackets or something?
Thanks
I think you're talking about compilers that translate SCSS into CSS (and their integration in PhpStorm).
So maybe you will be interested in Brackets-SASS Plugin.
Enviroment
I have an extjs 6 application which is already compiled and the css files like they should be. This application wasn't compiled for a while and now it's generating a different (wrong) css file. Since someone else changed the app, I have no clue what has changed since the last compilation. I compile with sencha app build development and the following CSS files change:
build\development\MyApp\classic\resources\MyApp-all_1.css
build\development\MyApp\classic\resources\MyApp-all_2.css
There are a few more files in the folder which do not change.
Versions:
Sencha Cmd 6.1.3.42
SDK Version (if neccessary) 6.0.2.407
Problem
I want to generate the same css like before. It seems there are just a few files which are not included within the compilation process, like:
ext/classic/theme-base/sass/etc/mixins/frame.scss
ext/classic/theme-base/sass/etc/mixins/slicer.scss
ext/classic/theme-neutral/sass/src/tab/Tab.scss
Question
What do I have to do, to get the old css? Is there some file with includes? Like classic\sass\src\view\main\Main.scss or something? I guess those includes are somewhere (since it already worked at least once) and maybe commented out or something.
What I've already tried
I tried to compile with different themes refered by the app.json attribute was builds->theme. I also tried a lot of playing around stuff, which I can't describe here in detail.
Any advice would be greatly appreciated!
Thanks in advance!
If you have any questions leave a comment and I'll try to add it to my text!
I am getting really confused about configuring Sass config options. Basically I want to disable the line comments in the compiled css file. So I went in and created a sass.rb in the Initializers folder with the following line:
Rails.application.config.sass.line_comments = true
I then restart my apache server and check in Safari web developer, my css file still contains the comments like /* line## /path/to/css/file */ above every css statement. I then test it in Firefox and open Firebug, and I don't see those line comments there, which suggest inconsistent browser behavior.
So I go back to my initializer sass.rb file and turn on line_comments, restart the web server and try again, this time I get the exact same result as before, nothing's changed, that basically tells me either that's specific to the browsers, there's a problem with the setting scope/syntax, or there's a caching issue (I'm working in development, so there shouldn't be any caching, right?). I'd really appreciate if someone can provide some insight on this. Thanks.
EDIT: The proposed solution to make a change to the sass file(s) didn't solve anything so I doubt it is the same problem.
Note: I am using sass with rails and I am getting separate css files for each of my sass files, which doesn't seem very right...
The problem was a combination of needing to set config.assets.debug to false for development, setting config.assets.compress to true, and probably a better understanding of sass compilation.
I am trying to use LESS CSS to write my CSS. I have imported the style.less and less.js file in that order.
Now i wanna extract the CSS that LESS generates.. is there any way i can do that ? i dont want to use the script to generate it dynamically in production. just for development.
You can extract the CSS using the Firebug extension in Firefox. The compiled CSS appears under the menu choice "inline" in the CSS tab.
http://incident57.com/less/ if you're fortunate enough to use OS X, and there's a ruby gem too http://rubygems.org/gems/less although this has been superseded by the node.js implementation installed through npm. Check http://lesscss.org/ for more information.
There's also http://www.dotlesscss.org/ for windows, but not sure how useful it is.
And in 2013 we have:
http://less2css.org/
Seems to work just fine for me. Just copy/paste.
Chances are you'll want to minify your CSS after this, so:
http://cssminifier.com/
For others who'd stumble here, in modern browser you can see it in the LocalStorage. I use Chrome and it's in the dev toolbar under Resources.
In my case we also want to save the css file automatically (we have a tool that generates a template), we can do it easily with javascript.
This returns the generated CSS, just replace it with the right path, as you see it under the Resources tab:
localStorage.getItem('http://domain.com/css/main.less');
Then we send that through Ajax to save it in a css file. When switching to production we remove the less and replace it by the generated css file.
I'm using lesscss, the 'framework/compiler' for css. My IDE, dreamweaver, does not recognize .less as CSS. So no niceties such as error checking or code completion there. Is there anything I can do about that?
Dreamweaver can be configured to recognize "new" filetypes and treat them as editable under preferences. You can also edit some config files to help DreamWeaver figure out how to treat the files so it does code highlighting, etc., though in my experience, it does not always work as you would expect. On the other hand, can lesscss be configured to output .css files?
Here's an Adobe article on getting Dreamweaver to add new file types.
http://kb2.adobe.com/cps/164/tn_16410.html
less syntax highlighter extention
http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=2756522#
You can force DW to "recognize the files" although not parsing as far as I know. This might be of help : http://blog.assortedgarbage.com/2012/03/using-dreamweaver-with-sass-and-less/ that might be of help
Try giving the extension: less.css, to your css file.
Example: styles.less.css.
This worked for me, but I still need a base stylesheet, such as: styles.css.
Also,
You can compile .less files to .css directly from within Dreamweaver using a free (Donation-ware) plugin:
http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=2692522
Dreamweaver has a very hard time with LESS, in my experience. It doesn't properly handle nesting and will color those as though they are syntax errors. However, it is mostly workable since the auto-complete does at least still work, and the overall coloring is okay on everything except nested items. (at least for me)
Also the extensions that are referenced above do not work on mac.
If you are having trouble getting DW to be able to open and color code LESS at all, try this--
1) Change some DW config files:
For Mac users, there are TWO configuration folders (at least for DW5.5). Two sets of identical files, FOUR in total files, have to be changed:
~/Library/Application Support/Adobe/Dreamweaver CS5.5/en_US/Configuration/DocumentTypes/MMDocumentTypes.xml
~/Library/Application Support/Adobe/Dreamweaver CS5.5/en_US/Configuration/Extensions.txt
and -
Adobe Dreamweaver CS5.5/Configuration/DocumentTypes/MMDocumentTypes.xml
Adobe Dreamweaver CS5.5/Configuration/Extensions.txt
And this technote tells you what exactly to change in those files:
http://helpx.adobe.com/dreamweaver/kb/change-add-recognized-file-extensions.html
Install a LESS Compiler
and for those on mac, this little app works GREAT. All it does is watch your less files and automatically save them to css on save.
http://incident57.com/less/
I hope that is helpful to someone!
http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=2756522#
This actually does all that and more, as CSS and less have a little different syntax specially when it comes to nesting rules inside one another.