An app that generates a shell script to build a directory structure based on your Sass manifest file
CSS JavaScript Shell
Switch branches/tags
Nothing to show
Clone or download
una Merge pull request #25 from braden337/fix-underscores
Issue with adding underscores to output
Latest commit a6c68a3 Jul 23, 2015
Permalink
Failed to load latest commit information.
examples
.gitignore sass source map setup Jan 7, 2015
LICENSE Initial commit Jan 7, 2015
README.md updated README 🌺 Jan 21, 2015
index.html
package.json
sass-director.js
sass-director.sh
sass-director.svg
scripts.js
style.css
style.css.map moving site files back into root Jan 23, 2015
style.scss

README.md

Sass Director

An app that generates a shell script to build a directory structure based on your Sass manifest file.

Using the Website

Input:

@import "utils/variables";
@import "utils/functions";
@import "utils/mixins";
@import "utils/placeholders";

@import "base/reset";
@import "base/typography";

@import "layout/navigation";
@import "layout/grid";
@import "layout/header";
@import "layout/footer";
@import "layout/sidebar";
@import "layout/forms";

@import "components/buttons";
@import "components/carousel";
@import "components/cover";
@import "components/dropdown";

@import "pages/home";
@import "pages/contact";

@import "themes/theme";
@import "themes/admin";

Default Output:

mkdir utils;cd utils;touch _variables.scss;touch _functions.scss;touch _mixins.scss;touch _placeholders.scss;cd ../;mkdir base;cd base;touch _reset.scss;touch _typography.scss;cd ../;mkdir layout;cd layout;touch _navigation.scss;touch _grid.scss;touch _header.scss;touch _footer.scss;touch _sidebar.scss;touch _forms.scss;cd ../;mkdir components;cd components;touch _buttons.scss;touch _carousel.scss;touch _cover.scss;touch _dropdown.scss;cd ../;mkdir pages;cd pages;touch _home.scss;touch _contact.scss;cd ../;mkdir themes;cd themes;touch _theme.scss;touch _admin.scss;

It works for files in the same directory and multiple subdirectories:

Input:

@import 'file1';

@import 'dir1/file2';
@import 'dir1/dir2/file3';

@import 'dir3/dir4/file5';

Output:

touch _file1.scss;mkdir dir1;cd dir1;touch _file2.scss;mkdir dir2;cd dir2;touch _file3.scss;cd ../;cd ../;mkdir dir3;cd dir3;mkdir dir4;cd dir4;touch _file5.scss;cd ../;cd ../;

Options

Options Default
Sass syntax .scss, .sass .scss
File prefix _, no _ use _

Node Module

There is now a node module! To install, either simply type npm install -g sass-director or clone this repo and use the command npm install -g. Then you can use the following format to build your directories and files:

sass-director <filename> <directory>

For instance, if you are in the home directory and have created a sass folder, you can type sass-director sass/main.scss sass, or you can simply leave off the directory command when inside of the sass folder: sass-director my-manifest.scss.

TO-DO

  • quotation style ' or "
  • choose .sass or .scss
  • make interface pretty
  • Option to add '_'
  • ignore comments
  • allow for subdirectories
  • create cli so we can go sass-director file-name.scss
  • Options for sass and underscore in node module
  • Add shellscript docs