Is there a way to use Sass or Compass or anything like that without Ruby?
I have been looking around google and this site and can't find anything, any help would be appreciated. Thank you
Sass was originally written for Ruby, but now they've created libSass which is a C/C++ port of the Sass engine, which makes it easier to integrate the engine into an IDE or another language. At this point, you can use the Sass engine in Ruby, Node.js, Python, PHP, Java, .NET and others. For more information, visit libSass. Also, your IDE might have a plugin which would support Sass, without the need of ruby by using the libSass.
The original answer below may or may not apply to your situation (depends on whether or not your language has implemented support for libSass or not). I decided to leave it the way it is for archive reasons.
Sass (requires Ruby)
Sass is written in Ruby, so you’ll need Ruby installed as well.
Taken from sass's site
Compass (requires Ruby, as it's based on SASS)
Compass is an open-source CSS authoring framework which uses the Sass stylesheet language to make writing stylesheets powerful and easy.
Taken from compass's site
Less (written in js, requires node.js or less.js included in the page)
LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions. LESS runs on both the client-side (Chrome, Safari, Firefox) and server-side, with Node.js and Rhino. Taken from Less's site
These are the main processors out there that I know of.
You may write your own parser/port for any another language of choice.
In other words, no you can't use sass/compass without having Ruby because the program itself (sass & compass) IS written in Ruby. So you'll definitely need it in order to run it.
Actually there is a library that provides binding for Node.js to libsass, the C version of the Sass: https://npmjs.org/package/node-sass
It allows you to natively compile .scss files to css at incredible speed without Ruby installed.
To install just run:
npm install node-sass
And there is also a Grunt extension if needed: https://github.com/sindresorhus/grunt-sass (this is what I've been looking for in this question)
Find out more at: https://github.com/andrew/node-sass
It's true that the question is not clear enough, but i'll try to address some issues. There are other CSS pre-processors that don't rely on Ruby (two coming to my mind right now are Less, which i've used and liked, but not as powerful as Sass, and Stylus, which i haven't used, both based on JavaScript), but as you're specifically asking about Sass+Compass, and as i'm still looking for the same answer, i'll talk about that.
#JamundFerguson said:
Is there a way to compile Sass without Ruby? Depends.
There is
Sass is a pre-processing language. There's a compiler built in Ruby for it and anyone can write a compiler in any language. There's a C implementation of a Sass compiler called libsass which can be used on any language that allows to import C libs. It's the library used by node-sass, which is a compiler built in Node.js, which I didn't tried yet and don't know how it could work and if it's ready for production use. It may be a question of time for Compass to be ported (maybe you end up doing that?) and so we can have a compiler which doesn't depends on the Ruby gem (currently, there's a node-compass module that does relies on the Ruby gem).
Other languages
So far i've mentioned the possibility for a Node.js compiler, which, as you may know, it's a JavaScript environment, being the language of the web and my language of choice. But you didn't specified which language you would like the compiler to be written into. I think there may be compilers built in many languages, for example, #EricMeyer mentioned a Python compiler. Maybe he's using pyScss? That seems to have built-in support for Compass. But then you need a Python environment. So the thing is: you'll need some environment for a compiler unless you run natively compiled binaries. (Less has less.js which can be included on the page to run client-side and avoid the compiling step, but it's not meant for using it on production.)
Native apps
I've worked for a year with CodeKit, which does very well, compiles Sass/Compass, Less, Stylus and template languages like Haml, Slim, Jade, etc. Rebuilds your assets when they change automatically and you see the changed on your browser immediately. The only thing that i didn't liked was that when moving to a different computer, installing CodeKit, checking out project and trying to use it, i had to reconfigure the project settings, which i had to remember so i could get to a build like the one i made in the other computer. Also i started working with a team, and they had also to configure the project with the same settings (sometimes not having the same project config lead to ugly inconsistencies) and also members of the team using Ubuntu couldn't use it. That's why i started to think on making a command-line tool to build projects and discovered Grunt immediately, and fell in love with it.
As #Dave mentioned, there's Scout and also there's LiveReload, but haven't used them.
Conclusion
Conclusion is i have not a strong conclusion. I'm still looking for the same answer, but i hope this answer sheds a little bit of light on the status of compiling Sass/Compass outside of the Ruby environment.
Just a little bit of an update on this, you can use SCSS/SASS files and generate the correct files on the fly without installing Ruby by using a program called Scout.
Scout has its own self contained ruby environment and is coded in java so make sure you java is up to date before using. Linky here.
Regards :)
You can actually parse sass without ruby, you can use node-sass.
details here: https://github.com/andrew/node-sass
If this is for .NET, there is now a wrapper for libsass. Available from Nuget.
Adobe Brackets (free, open source) can compile LESS, SASS and Stylus when the files are changed, and update styles during live preview, you just need to install required extensions from the extension manager.
Get Brackets and enjoy !
Edit: As other questions suggest node-sass is also a good option if you have nodejs already installed.
macOS users can install Dart Sass by running:
$ brew install sass/sass/sass
Windows users can install Dart Sass by running:
$ choco install sass
More info:
https://github.com/sass/dart-sass
Related
does someone knows how to program a compiler that compiles SCCS/SASS to CSS without a VSCode extention? Can someone explain which language you need and maybe a basic concept? Thanks!
There are several ways to create your "own" sass compiler.
You could use "bundlers" like Parcel.js or Webpack where you have to write your own logic, to compile the sass/scss files.
Another way which could be similar like webpack is to use task runners like Gulp or Grunt.
Most of them will rely on some third party packages like node-sass (it is deprecated now) or dart sass.
Of course if you don't want to burn much time to learn one of these options (webpack, gulp, grunt) you could always write your own compiler with node.js
For me, I prefer to use webpack . Just have to write my webpack.config.js file once and could use it almost everywhere in my pet projects.
For most of these you will only need some javascript and you are good to go.
Hope it helps!
I am doing an online course on Advanced CSS and Sass and found out that the way it is shown in the course is a bit outdated.
The course uses node-sass in the dependencies, which is deprecated. A direct alternative to this would be to use Dart-sass (I will write my steps to do so in the end, maybe someone will benefit from this :))
Another alternative is to use the VS Code Extension "Live Sass Compiler". It seems that this option is quite well accepted.
However, I wonder what benefits and differences these options have. E.g. I had some troubles with the extension yesterday and then used the dart sass as a dependency and solved my problem this way. Maybe this was due to something wrong in my code, but still, it left me with this question and I think others might have the same in the future.
PS: It is my first question here, don't roast me if I did something wrong :D
For those interested in how to change the code from node-sass to dart-sass here are the steps (at least for me these were the steps in the course I did):
Install dart sass using the command line: npm i -D sass
Change your scripts where it says node-sass to just be sass (in package.json)
Change the -w in your watch:sass script to --watch (in package.json)
You can also do npm uninstall node-sass to get rid of it
I do not know what exact tutorial you are looking at. Also, I am not so experienced at the front-end, but in my opinion, using Sass as a css-preprocessor isn't the best option on production for now.
But, since you are asking how to implement sass, I'll describe a procedure, like you are using React with npx create-react-app.
First, you were right, about using dart-sass over sass. This command should help you with that: npm install --save-dev sass. According to the question, seems you already tried that.
After that, add new script to your scripts in your package.json file: "sass" : "sass src/Sass:src/Css --watch --no-source-map" and you are done.
In my own opinion, I prefer to implement it via npm instead of VSC plugin. It will more stable after all. But if you are using it, for test/study purposes, I think, you could try both.
If you want to use the most actual version Dart SASS with 'Live Sass Compiler' you need to take care about the version. The most popular version is not supported for years so it does not support Dart Sass.
But there is a fork which is supported and as fork you can use same settings.
To your Question about NPM and Live Sass Compiler: both are Javascript Version off Sass. As Javascript versions they are not as fast as if you install SASS direct on your System. The difference between Javascript vesion itself its not as big. So I think the best choice between NPM and Live Sass compiler is to use Live Sass Compiler (the forked version!) as it is integrated to the editor and easier to use direct from there.
If you need a faster solution you really should install the original version. That is not as difficult as it sounds. And there is a VS Code Extension as well wich make it possible to use that original installed version easy direct up from VS Code.
Detailed Information:
Install SASS direct on your system:
https://sass-lang.com/install
Information to the named VS Code extension:
https://stackoverflow.com/a/66207572/9268485
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 was wondering if someone could help me with the following problem:
I have a web project in visual studio and I am using SASS for styling. I use Grunt to execute SASS and compile the .scss files to .css files. But for this to work Ruby must be installed on my system together with a SASS module. When someone else does a checkout of my project they cannot run SASS if they don't have ruby intalled on their system with this SASS module.
Is it possible to add a ruby installation (executable) with the SASS module to my project so that when someone else does a checkout of my project they can run SASS without having ruby installed on their system.
Thx in advance for any help, also this is my first question on stackoverflow ever, tips are welcome.
(Things I have run into but will probably not work are: Less, node-sas)
I don't think you'll be able to easily add a Ruby installation executable with your project. And I don't think you should.
Have a look on libSass, which was created and maintained by Sass authors. This library allow non-Ruby users to compile Sass. You've got plenty wrappers for various languages, like .NET, Java, JS, PHP, Python...
I think this could be a workaround that fit your needs.