CDN Converter - Scss to Css - sass

i wonder if there is some CDN converter, which will convert my scss to css. I need to write some simple mockup project (SASS is required here) and don't want to prepare gulp or webpack for it. Also i have to avoide all websites like codepen etc.
Do you know something like this? Maybe there is something else, what will allow me using SASS files direct in my project.
Cheers,
Daniel

What do you need is an Online Converter, if I correctly understood.
Take a look at sites like Sassmeister or online SCSS or SASS compilers.
If you don't want to depend in your connection, you can do this if you have ruby installed.
gem install sass
sass --update scss:css
Then your SCSS will be compiled CSS

Related

How to update SCSS on Wordpress?

I recently learn how to use SASS, on local. And I found out that it is possible to use it in a wordpress theme.
I manage to install and use it without problem. But now I want to customize _settings.scss, I don't know how to transform my scss in css (I used Grunt, in a console using ruby to do so in local.)
You should be editing your files locally and uploading once finished rather than modifying files on the server. There should never be any need to compile SASS on the server itself.
If you really have to edit on the server you could login using SSH and start the watcher (install sass and run sass --watch with your settings).

Setting up compass/sass project

When I was young I experimented with CSS, and then after a while my peers pressured me into trying SASS. It's been a slippery slope and the pushers have now got me onto Compass.
I don't really understand the difference between the following two commands
sass --compass --watch .
compass watch .
As I was having problems with the first command, I tried setting up a Compass project and using the 2nd.
However, this dies saying "Undefined mixin 'background-image'". I can get that error to go away by adding an #import "compass"; at the top of my .scss file. But why would I have to import compass when I'm running the compass command itself?(!) Surely all the libraries are included there? Obviously not.
Any help gratefully received.
The --compass flag for the sass command is only intended to be a quick way to access the Compass library. If you actually need to configure Compass, then it is recommended that you setup a Compass project and use the compass command (see: https://github.com/nex3/sass/issues/858).
Compass is more than just a collection of mixins for prefixed properties. It is an extension manager that happens to have a few extensions by default (compass, blueprint, etc). Using Compass only grants you access to the helper functions (which are written in Ruby) by default. This is by design: you include only the items you need, not what Compass thinks you need.

Meteor.js & SCSS/Compass

Anyone doing development with meteor and SCSS. How do you get started, there are no packages for meteorite that i could find that compile .scss files into a specific folder?
Have you tried just compiling the sass/scss into css locally during development? Meteor shouldn't complain if you have your config.rb inside of the client folder along with a sass folder and compiled css folder. It should just automatically read the css per norm. Running $ compass watch inside of this client folder where the config.rb resides is an easy way to automate this css compilation. Telescope is a great sample Meteor app that uses sass in this fashion.
--Alex
Just to get this posted as an answer (was posted as comment); bookcasey posted this sample project as well: https://github.com/gdumitrescu/scoreboard which provides some guidance on how to use sass/scss. Hope it helps.

what is the difference between sass watch and compass watch

For sass currently I am using
sass --watch path1:path2
to compile scss file to css but i even found
compass watch path1:path2
also. Is there any difference between these two watches? I created a project with compass create project and found that there are two main folders called sass and stylesheets I looked to screen.scss file and I found the code #import "compass/reset";, but there isn't any directory called compass to call the reset.
I am really new to sass and compass. Can anyone explain me how to use compass? Any help will be greatly appreciated. Thanks in advance.
To understand the difference, you must first understand the difference between Sass and Compass.
Sass is a language which is an extension of CSS. It has built in math functions and adds the ability to add more functions and mixins - but it doesn't include any.
Compass is a framework for Sass. It adds additional functionality on top of Sass such as CSS3 mixins, layout helpers and other utilities. It also gives you the ability to add additional 3rd party frameworks into your project (called extensions).
So with that, the difference between the two are:
sass --watch will compile Sass files, but because it doesn't know anything about compass, it will just ignore it.
compass watch is just like the Sass command, only it knows about the additional Compass functionality. So when you import compass/reset - it knows what to import.
You can find a reference to all Compass' functionality here: http://compass-style.org/reference/compass/
At the top of each page it will show you which part of Compass to import. For example, here is the page about reset: http://compass-style.org/reference/compass/reset/

SASS plugin for CSS3 cross-browser compatibility?

Is there a SASS extension that would take SASS stylesheets, find neutral properties (e.g. border-radius) and output all vendor-specific properties for it (e.g. -webkit-border-radius etc) automatically?
I don't really want to create all the mixins manually nor write the code manually. I'm sure there must be such an extension, but I can't find it. Help?
There is a very nice gem that would fit your needs. It's called Bourbon
It will not replace your css with the vendor-specific one as it works as SASS is made to work.
It is basically a mixin collection that generates the cross-browser css properly.
Compass has a CSS3 module that handles a lot of that stuff.

Resources