Eclipse: why is CSS syntax highlighting not working consistently? - css

I have a puzzling situation. Using Eclipse Oxygen.
One project, which I think I started as a Web Project in Eclipse Neon, does syntax highlighting for CSS files.
My new project, which I think started out as a PyDev Project here in Eclipse Oxygen, does not do highlighting for CSS files.
I'm unclear about the types of project because neither of the icons in Package Explorer (which are different) seems to correspond to any of the possible projects when you go File --> New (I've looked at all of them, including the icons under Other).
So it's really 2 questions: how do I find out what project type I'm working on... and how then do I configure the PyDev one (if such it be) to apply syntax highlighting to CSS.
Incidentally, the PyDev project is using a project location outside the default Workspace, not that this should make any difference.

Installation instructions can be found in the WTP Wiki at https://wiki.eclipse.org/WTP_FAQ#How_do_I_install_WTP.3F . Or you can use the Marketplace entry for it at https://marketplace.eclipse.org/content/eclipse-web-developer-tools-0 .

As suggested earlier, I believe you were missing highlighting because the WTP tools weren't installed in your PyDev environment. Nevertheless, if you need to spend more than a few minutes working with CSS, I would encourage you to give CodeMix a try for truly superlative CSS support in Eclipse:
Supports all the CSS 3 properties, including support for variables
In-built Emmet integration reduces typing required
Includes a CSS validator
Sass and LESS supported too
For more, see: https://www.genuitec.com/tech/css3-in-eclipse/

Related

How to set grid-template-areas in sass (node-sass)

I have an ASP.NET project, which I used Sass.
I used WebCompiler to compile my .scss files.
The SCSS code shown here is valid CSS, and does not ruin my app when I run it. (I created a fresh ASP.NET project with VS2019 .NET 5 and VS2022 .NET 6, and they both have the same warning)
Since WebCompiler is using node-sass, I checked the official node-sass repo for a solution regarding this. Unfortunately, there was none.
Is there a way to remove these warnings when setting a value for grid-template-areas?
If I completely remove all warnings (Tools -> Options -> Text Editor -> SCSS -> Advanced -> Enable Validation), I won't know potential errors/warnings in the future. I just want to remove this warning.
(Or do I need an extension for this?)
This SO question is similar to my problem. The problem of that question is about sass maps, and mine is about grid-template-areas.

Include SASS compiler in build definition in Visual Studio? (and avoid merging the CSS files when using TFS)

We plan on using SASS instead of plain CSS for our SharePoint project very soon. While testing and trying to set everything up, I ran into some problems:
We're using Visual Studio 2015 and on my developer machine I installed the Web Compiler Extension to compile the .scss-files and partial files to a regular .css-file.
That worked very nicely but the problem is, that there will be a few developers working simultaneously on the styles. I want to avoid merging the resulting css-file each time someone tries to check in something into source control (we're using Team Foundation Server).
Since there is a build running every time someone is checking in their changes, and to deploy the resulting solution to the nightly build machine, the idea was to somehow include the SASS compiler in the build definition. This way the more readable scss-files get merged and the build creates the resulting css-file to include it in the solution.
Maybe I'm thinking too complicated, but I just couldn't get that to work so far.
Any ideas how I can achieve that?
(Maybe I should also mention that none of the dev machines got any internet connection)
If you're building an MVC app, you can use MVC's bundling feature along with the SASS NuGet package. And, be sure to enable minification. There's a UseNativeMinification property on SassAndScssSettings. That way you don't need to deal with merging the css file when you get latest or check in. Reference this thread: SASS/TFS best practice
Another way is running a script (e.g with PowerShell task) on the server that to install the gulp components and then call the sass compile task to compile the SASS. Refer to Powershell build - compiling SASS for details.

VS Community 2015 Sass Singularity

Is there a possibly way to install sass singularity in VS Community 2015?
I had the same problems and had to do some digging around to find the solution. So I'll explain my steps (This may not be the correct or best way, but it works, I have been using it and adding to it without problems so far over the last week or so).
As a quick aside, visual studio (at least from 2013 onward and certainty 2015, cause that's what I use) does support bower, grunt and gulp as far as I know. I just don't know how to use these systems. So there may be a faster, more robust, and better way to do this.
To save you time later, you will need to follow the steps below to download the Breakpoint library because it seems the singularity library has a dependency on it. But it's the same steps.
Go to the GitHub repo and download the repository as a zip file and extract it.
In the case of breakpoint go into the stylesheets extracted folder and copy and paste them into a folder you created inside your project.
While doing this create another folder and do the same thing with Singularitygs (it has the same stylesheets folder).
In your visual studio project click show all files and include both these new folders - this will have the effect of including all the files within them.
Goto extension manager and download the free Web Compiler (part of the web essentials toolkit). This gives VS the ability to do all kinds of cool stuff with cool files such as automating the process (without any extra setup) of transforming your SCSS files to CSS. You may need to restart VS after installing it.
Finally - create your own .scss file, and at the top add these includes:
#import '../_breakpoint.scss';
#import '../_singularitygs.scss';
You'll need to use VS intellisense help to ensure you are pointing to the correct folder locations for your setup.
Once they are included you can work away like normal on your .scss using all the new library functionality.
This seems to be the process for installing any .scss / less library in visual studio. But I'm surprised I did not see any info around about how to do it. I had to spend a while digging through the code of all 3, especially web essentials, to figure it out - only to find out that I did not need to even look at the code at all. :)
Hope this helps.

Working with SASS in a Mono WebForms Project

I am in the process of creating a website using Mono. It will be a standard webforms app (not MVC) but I'd like to use SASS for the CSS (specifically scss). However, I can't seem to get SASS to work with a mono webforms application. I tried using SassAndCoffee from NuGet and followed the standard setup instructions which said I should just reference my scss files as css files (e.g. application.scss would be referenced as application.css in a link attribute in the head. see http://blog.paulbetts.org/index.php/category/programming/mono-net/). That didn't work (or at least I'm assuming it didn't since my page rendered with no CSS and this scss has been tested on a rails platform so I know it works).
Next I tried using SquishIt which has an NSass wrapper. I followed the instructions here: http://www.cassandraking.net/wordpressapp/integrating-sass-into-net-using-nuget-and-squishit-sass/. This throw a 500 error because asp.net was unable to find NSass.Wrapper.proxy.dll. A quick google search led me to discover that because I was targeting "Any CPU", it couldn't choose between "NSass.Wrapper.x86" and NSass.Wrapper.x64". Sadly, however, MonoDevelop doesn't seem to want to give me the option to target x86 or x64 (the only option I have is to target "Any CPU").
I've kind of run out of options. Since I'm not using MVC, am I able to using SASS with a standard WebForms project using the Mono platform? Has anyone done this and can provide me some pointers?
In case anyone else runs into this, I never really found a viable solution in terms of a plugin. Honestly, Xamarin studio doesn't even seem to have a built in SASS editor as it isn't able to colour code anything in a SASS file. I ended up just using the sass command in terminal to convert a sass file to css. At a terminal prompt in the folder where your sass is kept type:
$ sass mysassfilename.sass:somecssfilename.css
To edit the sass file, I downloaded Microsoft's Visual Studio Code which has a version for the mac. It works rather well.

Can the GitHub Atom editor show properties and functions of classes?

Recently I moved from NetBeans to GitHub Atom editor. How can I access properties and functions of classes in the editor?
I use a mix with the symbol gen and symbols view packages. First one very good about generating ctag file for your project and second one for inspect code and jump to the definitions of tags. Also, it supports Show all symbols in current file future. It have to show for you the members and properties of your classes.
In short: after installation open a work directory with your project and try alt + cmd + g, wait several seconds, ctags file generating now for you and after that cmd + r and just start typing any part of a method or property in the input.
In addition to all the previous answers, I would recommend you to check Atom's package goto-definition, with its optional "performance mode" (which requires you to install ripgrep).
goto-definition will allow you to find and access properties and
functions/classes definitions even if they are not written in the same file. In combination with ripgrep, goto-definition is extremely fast, and you will not have to wait for file indexing within your project.
If you are referring to the members of a Java class (which I assume, since you've used NetBeans before), then this is currently not supported in Atom.
Atom is a (fairly simple) editor that allows you to edit text files, while full-blown IDEs (Integrated Development Environments) like Eclipse, NetBeans or IntelliJ IDEA have full language support including running, debugging and browsing Java class information. It might be better to stick with one of the IDEs I mentioned if you are looking for this kind of functionality.
Having said that, there's the https://atom.io/packages/atom-ctags package, which supposedly can show some meta information about classes you're working on. It's primarily for C++, although it might work for Java as well (I haven't tried).

Resources