Compile .less file in Visual Studio without web essentials? - visual-studio-2013

I know Web Essentials can compile less files. Are there any other VS plugins that can compile .less files?
VS 2013 update 4.

Yes. Compiling has in fact been taken out of Web Essentials 2015, using gulp and grunt is now the preferred approach. To compile LESS with Grunt you can use grunt-contrib-less.
To get your Grunt or Gulp file to run nicely in Visual Studio you can use Task Runner Explorer Extension. Scott Hanselman has a good post introducing this.
I have written a post showing you how to compile SASS using the Task Runner Explorer. This approach can also be transferred to LESS of course.
This article shows you how to compile with Grunt and LESS also.

Related

How can I setup my VS 2013 TypeScript project to compile my typescript files but exclude my node_modules?

I'm working on an angular2#beta project in VS 2013 after familiarizing myself with it in IntelliJ. IntelliJ can be set to find the tsconfig.json file and, as of TypeScript 1.6, it can therefore read the "exclude" property and not attempt to compile any of the node_modules. Now that I've moved to VS 2013 with TypeScript 1.7, I'm running into the issue where it's trying to compile the node_modules. I've included the tsconfig.json, but from what I've read, tsconfig.json is fully supported only in VS 2015. Is that the latest on this issue? Is there some way to tell VS 2013 to exclude those files or to use my tsconfig.json instead?
I should also note that angular2#beta includes its typings with the rest of its source when I do an npm install. This puts all the typings mixed in with all the files, and I assume perhaps I could have to delete all the non-.d.ts files to get the typings without all the other errors. Previously you could use "tsd install angular2" to get the typings but this is no longer available. A solution to this would negate the previous problem.
Update
I can get all this working on VS 2015 - Community Edition, but I would really like to see if I can get it working on VS 2013.
Higher versions of Typescript will not be supported in Visual Studio 2013. But you don't need to edit and compile typescript files in one and the same IDE. It's handy but I use often different IDE's for the same project as long as the build processes are aligned (read: can be done by CLI). So yo can use Visual Studio Code for your Typescript work and compile it. Full support and Intellisense for the tsconfig file.
https://code.visualstudio.com/

Debugging TypeScript in Visual Studio using Grunt / Gulp processed files

I'm currently using the Microsoft.AspNet.Web.Optimization to handle my bundling / minification in a greenfield TypeScript / Web API project.
In release mode I get reduced HTTP requests and minification. In debug mode (where I do my development) I get the full Visual Studio debugging experience for my TypeScript code. This is because Web Optimization in this situation is pointing directly at the js files created by the TypeScript and hooking back into the TypeScript thanks to the source map loveliness. There are some rough edges around caching in debug mode as well as some limitations but mostly this is a pretty nice solution.
I'm now looking to switch to using either Grunt or Gulp to handle the bundling / minification (incidentally I understand this is the direction that Visual Studio is planning to move anyway with ASP.Net vNext).
I want to maintain the debug experience of being able to debug my TypeScript using source maps with this approach. My assumption is that if I have a Grunt / Gulp job that (in debug) builds a folder with *.js, *.map.js and *.ts files that should preserve the Visual Studio TypeScript debugging experience.
I thought I'd check if there are any problems wrong with my underlying assumption. Does this sound workable or am I starting myself down a blind alley?
I'm using Visual Studio 2013.3.
If you have the *.map.js files and you attach to an internet explorer instance (with sourcemaps enabled in the IE debug tools) your breakpoints will work.

Compile LESS to CSS from command line - Web Essentials

We have a MVC 4.5 app and it has a bunch of LESS files. VS2013/Web Essentials does a fantastic job of compiling the LESS files to CSS as long as I am in VS. We had a new designer join our team and he is not too keen on using VS and I dont blame him. We have psake build scripts that build our project using MSBuild, so we can give him a powershell script to build the application on his machine without opening VS but surprisingly the LESS files are not getting compiled into CSS when built by MSBuild.
Is there any way I can use the same tools that Web Essentials uses to compile the Less files from the command line?
Alternative solution, use DotLess (http://www.dotlesscss.org/) for build time compiles. I have it compiling our LESS files using a VS post-build event. Though, guess this could conflict with Web Essentials, not sure who will run last. Currently not using Web Essentials.

Compile Less files in Visual Studio 2013 for Web

I am new to Less and I am using Visual Studio 2013 for Web for development. And i aware Visual Studio supports less files.
I have added .less to my project and added small mix-ins..
While i build my project i didn't get corresponding css files.. Because of using Express edition i can't add Web Essential extension.
How do i compile my less files? Or is there is any other options to compile less files?
I know this is now old but if you happen to still be looking for a solution then you will need to use an external application to compile your LESS files. There are a few out there but two I can recommend are...
Koala - http://koala-app.com/
SimpLESS - http://wearekiss.com/simpless
I have used both in conjunction with Visual Studio and can recommend either. They can compile on-the-fly every time you save your LESS file within VS and work pretty seamlessly.
look at : Can Visual Studio 2013 generate CSS files from .less files?

instruction on how to compile using sassy studio in visual studio

I have been using Compass to compile sass files in Windows environment either on a command line or using Compass-app to watch a directory.
I've just started using Visual Studio (pro 2013). I have installed sassy studio using nuget but I can not find any instructions as to how to compile.
It looks like sasssy studio comes with its own sass compiler or it can use Compass. I've looked at the setting menu but nothing seems obvious as to how to compile to CSS automatically on save or even doing it manually.
1) Does the set up require a config.rb file or is there a different way to set up the configuration (such as 'require' options)?
2) How does one initiate the compile operation either automatically or manually?
TIA
I had the same trouble, so I followed this guide for Integrating the Compass CSS Framework into Visual Studio. I installed Ruby and Compass and then added the path to the Ruby folder in the SassyStudio options.
I was originally using Web Workbench so my Visual Studio project was already set up as a Compass project (had a config.rb file). So now it compiles correctly when I save.
I don't know whether this is necessarily the correct way, but it worked for me.

Resources