Skip to content

Setting up Skeleton Sass 2 for first time use

AtomicPages LLC edited this page Nov 7, 2016 · 1 revision

Setting up Skeleton Sass 2 for first time use is easy to do. Unlike Skeleton Sass 1, we have a perform a few steps before we are able to harness the power of this update.

Installing Skeleton Sass

We can install Skeleton Sass 2 through a variety of ways:

  1. Bower
  2. Sache
  3. Git
  4. Rails Assets
  5. Manually

Installing with Bower

Installing the latest release of Skeleton Sass with bower is as easy as running a simple terminal command:

Note: Click here to learn how to install bower

bower install skeleton-sass

Additionally, as of version 1.6.3, you can now install different versions from 1.6.3 and beyond by using the following syntax:

bower install skeleton-sass#1.6.3
bower install skeleton-sass#2.0.0-b11

To view all releases, click here.

Installing with Sache

We have not personally dabbled in using Sache. However, if you are interested then be sure to take a look at the sache readme for additional information.

Installing with Git

Installing Skeleton Sass with git is very easy to do. If you don't have git installed, be sure you have it available to your system. If you are unsure about whether or not you have git installed, see this article.

Installing via a Gem with Rails Assets

Start off by installing gem 'bundler', '>= 1.8.4' then add the following to your Gemfile.

source 'https://rails-assets.org' do
  gem 'rails-assets-skeleton-sass'
end

I'll auto build the Gem from the Bower package and all you need to do is require the files.

All Systems using the Console

We can verify that we actually have git installed by running git --version in our console window.

Special note to Windows users

You may have to launch Git Bash if you did not add git to your PATH. To check if Git has been added to your path type the following into your console window:

echo %PATH%

If you see the following in your PATH:

C:\Program Files (x86)\Git\cmd;

then you are able to use Git from the command prompt. If you do not see this then you need to launch Git Bash from your start menu.

At this point, all we need to do it cd to the directory where we want Skeleton Sass to live and then issue:

git clone https://github.com/atomicpages/skeleton-sass.git
OS X/Windows using Github App

Github has released a handy app that is available to OS X and Windows. Download and install the application:

Once the application has been installed, launch the application and follow the procedures to set it up.

  • Open the github page in your browser (refresh the page if it's already open)
  • Click on the "Clone in Desktop" button located near the bottom of the right sidebar

  • A dialog box will appear, asking if you wish to launch an external application. Press "Launch Application" and continue.

  • Choose where the clone Skeleton Sass to you're ready for the next step!
OS X/Windows using SourceTree
  1. Launch SourceTree and click on Clone/New in the upper left corner
  2. Either click the globe icon to search for Skeleton Sass or enter the clone url manually
  3. Set the destination path and then clone Skeleton Sass

Configuring Skeleton Sass

Skeleton Sass 2 requires two very simple steps to ensure that your hard work doesn't disappear when you update. There are two ways we can do this:

  1. Running setup.rb
  2. Manually
Automated Setup

We wrote a simply ruby script that does the hard work for you. Run bin/setup.rb in your console window to start the setup process. Follow the prompts and you will be notified when the setup is complete.

A special note to Windows users

If you have Ruby installed on your system then simply navigate to the bin directory and double click on setup.rb. Windows will automatically run the script for you and it will exit upon completion.

Manual Setup

The manual setup only requires easy four steps to complete.

  1. Navigate to the root of Skeleton Sass 2 and rename skeleton_template.scss to skeleton.scss
  2. In the same directory, rename _MYconfig.scss to something else (i.e. _skeleton.config.scss)
  3. Open skeleton/core/_config.scss and on the last line, uncomment // @import "../../_MYconfig.scss"; and replace _MYconfig.scss with the new name of the global configuration file.
  4. Find your way back to the root of Skeleton Sass 2 and compile for the first time! You're ready to use Skeleton Sass 2!