Editing CSS Preprocessor Sources

Using plain CSS files in today's complex web applications often quickly reaches the limits of the technology and lot of people bothered by maintaining huge amount of styles calls for help. Though CSS3 tries to address some of the complains, the new modules specification creation process is quite slow and the adoption of the results in browsers is not instant. 

Several CSS preprocessor frameworks addresses most of the sore points of using plain CSS and adds plenty of useful features like nested rules, variables, mixins, useful functions and much more. 

The NetBeans editor now supports the most common frameworks: SASS (Sassy CSS syntax) and LESS.

Here is the list of basic features:

  • syntactic and semantic (parser based) coloring for the language constructs, 
  • indentation, simple reformat of code, 
  • code folds, 
  • go to declaration, mark occurrences, instant rename for variables and mixins 
  • code completion for variables and mixins,

  • vars, mixins and imported files shown in the navigator, 

  • find usages and refactor rename among files.


  •  code templates

Please give it a try, we're looking forward to your feedback! 

Comments:

Are these features in 7.3 or in the nightly build?

Posted by William Rouse on April 12, 2013 at 05:48 PM PDT #

Wow !! Netbeans is shaping up to be a formidable IDE for HTML5 development. Kudos to the awesome Netbeans team.

Posted by Donny on April 13, 2013 at 02:44 AM PDT #

>Are these features in 7.3 or in the nightly build?
The features are in dev builds only.

Posted by guest on April 15, 2013 at 04:40 AM PDT #

Awesome !

Posted by Roman on April 17, 2013 at 03:28 PM PDT #

This is perfect! Will it be available in netbeans 7.4?

Posted by guest on May 21, 2013 at 10:01 AM PDT #

Yes, this will be included in NetBeans 7.4 - you can try it out now in development builds at http://bits.netbeans.org/download/trunk/nightly/.

Posted by Petr Jiricka on May 28, 2013 at 04:19 AM PDT #

That's brilliant. We heavily use SCSS/Compass so this is really welcome news. Can't wait to try the dev build.

Posted by Vitesse Web Design Bendigo on May 28, 2013 at 04:49 AM PDT #

Nice thing, every think is good, but when I save a file, i obtain:

"C:\Ruby200\bin\sass.bat" "C:\wamp\www\compass-test\sass\screen.scss" "C:\wamp\www\compass-test\css\screen.css"
Syntax error: File to import not found or unreadable: compass/reset.
Load path: c:/temp
on line 1 of C:\wamp\www\compass-test\sass\screen.scss
Use --trace for backtrace.

and the compilation isn't done... :(

My scss is very simple:
@import "compass/reset";
body { background: red; }

(compile is ok width a "compass watch" via classic command line...)

What can I do ?

Posted by Richnou on June 26, 2013 at 10:04 PM PDT #

Thank you for this enhancement - it's a great addition to an already excellent IDE.

Would love to see the ability to set the output style (http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#output_style) instead of just using the default "nested" setting.

Posted by Joe on July 17, 2013 at 06:27 AM PDT #

Hi, less support is just amazing. thanks a lot. please keep working on that, there are some errors shown in latest bootstrap which have correct syntax. but anyway thanks again. it is great to see that netbeans is moving forward.

Posted by guest on January 21, 2014 at 03:32 AM PST #

Post a Comment:
  • HTML Syntax: NOT allowed
About

This is the blog of the NetBeans client-side web team, which develops the support for HTML5 applications in the NetBeans IDE.

Search

Categories
Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today