Editing Foundation with Sass (section)

== Installing Foundation with Sass ==

=== Installing the Foundation CLI ===

<syntaxhighlight lang="sh">
$ npm install --global foundation-cli
</syntaxhighlight>

=== Creating a new project ===

The `foundation new` command will create a foundation directory.  It prompts for the following project properties:

* '''Framework''' - Foundation for Sites
* '''Template''' 
** "Basic" includes Sass and a flat directory structure
** "ZURB" includes JavaScript processing, Handlebars templating, and image compression
* '''Directory/Project Name''' is relative to the current directory. So a directory with the project name will be created in the current directory.

These properties can be set with arguments to `foundation new`:

<syntaxhighlight lang="sh">
$ foundation new --framework sites --template basic --directory [app_name]
</syntaxhighlight>

=== Upgrading from earlier versions ===

First uninstall the existing Foundation installation

<syntaxhighlight lang="sh">
$ npm uninstall foundation
</syntaxhighlight>

=== Copying a project to another workstation ===

* Fetch the project from GitHub.
* Install `foundation-cli` and any necessary Foundation components (e.g. `foundation-sites`, `motion-ui`):

<syntaxhighlight lang="sh">
$ sudo npm install -g foundation-cli
$ npm install foundation-sites --save
$ npm install motion-ui --save
</syntaxhighlight>

The last two lines add Foundation components in the current directory under the `node_modules` directory, where they need to be located to hook up with the `sassPaths` values in `gulpfile.js`.
 
At this point if everything is present it should be possible to do `gulp sass` or `gulp build`.