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.
Related
I'm working on a cross-platform command line app that converts a user's text files into HTML output (similar to Markdown), and I want to provide the users an option to customize the output style with SASS/Less. Is there any CSS preprocessor/compiler library out there that I can use to compile stylesheets at runtime?
LibSASS requires installing things on Linux, which I'm trying to avoid because this needs to be a simple "one-click, run anywhere" utility without any dependencies apart from .NET Core. If I remember correctly, it also had conflicts when trying to import multiple platform NuGet packages in the same project.
I started with dotless but I've already stumbled on like 3 serious bugs and that project hasn't been updated since 2018 so I don't think they're getting fixed anytime soon. And I don't want to tie my project to a dead library for a pretty central functionality.
Looks like SharpScss is what I'm looking for. By adding
<PropertyGroup>
<RuntimeIdentifiers>win-x86;win-x64;linux-x64;osx-x64</RuntimeIdentifiers>
</PropertyGroup>
to the project file, the SASS parsing runs in both Windows and Linux (haven't tested on OSX) without having to install or configure anything.
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.
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/
I'm currently planning a new Windows Store App and wondered whether it would be at all possible to use SASS to help streamline some of the CSS development by utilising features such as mixins and variables etc.
I'm currently using Web Essentials to compile the SASS for web projects and wondered whether I could leverage its abilities on the app side of things.
What I've tried:
On the off-chance that it might work... I've tried adding an SCSS file to the universal app using Add > New Item... but the option doesn't exist (which doesn't bode well). I tried renaming an existing CSS file's extension to .SCSS. However, when saving the SCSS file, VS2013 explodes in a cacophony of popups suggesting that I tell Microsoft about the problem and then restart - which isn't really the result I'm after.
I'm using SquishIt and have a .less file which I add to a CSS bundle with the following line
.Add("~/content/styles/dev.less")
This compiles as dev.less.debug.css when I build the solution, however I'd like to be able to just save the .less file and it automatically compiles the css (so I see the change instantly in my browser as I would with a traditional CSS file).
I have looked at a number of extensions to achieve this (such as LessExtension and LessCssForVisualStudio) but these require the file to be added to the bundle as dev.css rather than dev.less. Mindscape Web Workbench does not compile LESS files in its free version so I do not know if it also requires dev.css.
I can't change the link to the file as the project will be worked on across teams, where some won't install an extension and will be happy to build the solution to compile.
Is there and extension that automatically compiles LESS that is built to work with SquishIt?
If you use it on non-production site, I would suggest using less.js (It will render css with js on client-side).
Squishit uses dotless under the hood, so you could use that directly.. either set it up so that you request the less file and a handler returns CSS or you can use the exe to compile on build and also the watch mode... I'm not sure what's best for you, but you can find more information on the dotless wiki (https://github.com/dotless/dotless/wiki/Using-.less)
Web essentials does this job perfectly and its free.
http://vswebessentials.com/