mirror of
https://github.com/danog/sass-site.git
synced 2024-12-12 17:37:36 +01:00
126 lines
4.2 KiB
Plaintext
126 lines
4.2 KiB
Plaintext
---
|
|
title: Install Sass
|
|
---
|
|
|
|
%h2 There are a couple of ways to start using Sass:
|
|
%ol.list-columns
|
|
%li.gui-application
|
|
%h3 Applications
|
|
%p= image_tag "illustrations/mouse.svg", class: "header-image", height: "160", alt: "Mouse"
|
|
%p
|
|
There are a good many applications that will get you up and running
|
|
with Sass in a few minutes for Mac, Windows, and Linux. You can download
|
|
most of the applications for free but a few of them are paid apps
|
|
<small>(and totally worth it)</small>.
|
|
|
|
%ul.list-feature
|
|
%li
|
|
= link_to "CodeKit", "http://incident57.com/codekit/"
|
|
%span.info (Paid)
|
|
%span.mac-icon
|
|
%li
|
|
= link_to "Compass.app", "http://compass.kkbox.com/"
|
|
%span.info (Paid, Open Source)
|
|
%span.mac-icon
|
|
%span.windows-icon
|
|
%span.linux-icon
|
|
%li
|
|
= link_to "Ghostlab", "http://www.vanamco.com/ghostlab/"
|
|
%span.info (Paid)
|
|
%span.mac-icon
|
|
%span.windows-icon
|
|
%li
|
|
= link_to "Hammer", "http://hammerformac.com/"
|
|
%span.info (Paid)
|
|
%span.mac-icon
|
|
%li
|
|
= link_to "Koala", "http://koala-app.com/"
|
|
%span.info (Open Source)
|
|
%span.mac-icon
|
|
%span.windows-icon
|
|
%span.linux-icon
|
|
%li
|
|
= link_to "LiveReload", "http://livereload.com/"
|
|
%span.info (Paid, Open Source)
|
|
%span.mac-icon
|
|
%span.windows-icon
|
|
%li
|
|
= link_to "Prepros", "https://prepros.io/"
|
|
%span.info (Paid)
|
|
%span.mac-icon
|
|
%span.windows-icon
|
|
%span.linux-icon
|
|
%li
|
|
= link_to "Scout-App", "http://scout-app.io/"
|
|
%span.info (Free, Open Source)
|
|
%span.windows-icon
|
|
%span.linux-icon
|
|
%span.mac-icon
|
|
|
|
%li.command-line
|
|
%h3 Command Line
|
|
%p= image_tag "illustrations/keyboard.svg", class: "header-image", height: "160", alt: "Keyboard"
|
|
|
|
:markdown
|
|
When you install Sass on the command line, you'll be able to run the
|
|
`sass` executable to compile `.sass` and `.scss` files to `.css` files.
|
|
For example:
|
|
|
|
sass source/stylesheets/index.scss build/stylesheets/index.css
|
|
|
|
First install Sass using one of the options below, then run
|
|
`sass --version` to be sure it installed correctly. If it did, this will
|
|
include `#{impl_version(:dart)}`. You can also run `sass --help` for more
|
|
information about the command-line interface.
|
|
|
|
Once it's all set up, <strong>go and play</strong>. If you're brand new to
|
|
Sass we've set up some resources to help you learn pretty darn quick.
|
|
|
|
%p= link_to "Learn More About Sass", "/guide", :class => "button primary"
|
|
|
|
%dl
|
|
%dt Install Anywhere (Standalone)
|
|
%dd
|
|
You can install Sass on Windows, Mac, or Linux by downloading the
|
|
package for your operating system
|
|
#{link_to "from GitHub", release_url(:dart)} and
|
|
<a href="https://katiek2.github.io/path-doc/">adding it to your
|
|
<code>PATH</code></a>. That's all—there are no external dependencies and
|
|
nothing else you need to install.
|
|
|
|
%dt Install Anywhere (npm)
|
|
%dd
|
|
%p
|
|
If you use Node.js, you can also install Sass using
|
|
<a href="https://www.npmjs.com/">npm</a> by running
|
|
|
|
%pre
|
|
:preserve
|
|
npm install -g sass
|
|
|
|
<strong>However, please note</strong> that this will install the pure
|
|
JavaScript implementation of Sass, which runs somewhat slower than the
|
|
other options listed here. But it has the same interface, so it'll be
|
|
easy to swap in another implementation later if you need a bit more
|
|
speed!
|
|
|
|
%dt Install on Windows (Chocolatey)
|
|
%dd
|
|
%p
|
|
If you use <a href="https://chocolatey.org/">the Chocolatey package
|
|
manager</a> for Windows, you can install Dart Sass by running
|
|
|
|
%pre
|
|
:preserve
|
|
choco install sass
|
|
|
|
%dt Install on Mac OS X (Homebrew)
|
|
%dd
|
|
%p
|
|
If you use <a href="https://brew.sh/">the Homebrew package
|
|
manager</a> for Mac OS X, you can install Dart Sass by running
|
|
|
|
%pre
|
|
:preserve
|
|
brew install --devel sass/sass/sass
|