Code Monkey home page Code Monkey logo

generator-sass-boilerplate's Introduction

Sass Boilerplate Yeoman Generator

Build Status SASS Boilerplate Yeoman Generator

A SASS (SCSS) generator for Yeoman. Quickly scaffolds out new SCSS files for a new project.

Getting started

  1. Make sure you have yo installed: npm install -g yo
  2. Install the generator: npm install -g generator-sass-boilerplate
  3. Run: yo sass-boilerplate
  4. Follow the prompts, inserting your user information as needed

Why It's Awesome

  • Variable names are auto-generated to match the project name. All variables are prefixed with the project name. This is great for auto-completion (in PHPStorm, WebStorm, SublimeText 2/3, most modern IDEs)
  • Author snippet at the beginning of each file with timestamp, copyright, package name, and description
  • Scaffolds out SCSS helpers based off of my sass boilerplate. Allows for leaner, better CSS. Optionally includes animation mixins and helpers.
  • Icon names are included when you decide to use basic Icomoon icons. You can easily change an element into an icon by doing @extend .icon-name
  • Quickly scaffold out your new app's styles with the ability to include/exclude files: default styles, CSS3 menu styles, form styles, type styles, and Eric Meyer's reset.

License

MIT License

generator-sass-boilerplate's People

Contributors

srsgores avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

generator-sass-boilerplate's Issues

Error

TypeError: Cannot read property 'Base' of undefined
at Object. (/usr/local/lib/node_modules/generator-sass-boilerplate/app/index.js:18:59)
at Module._compile (internal/modules/cjs/loader.js:702:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10)
at Module.load (internal/modules/cjs/loader.js:612:32)
at tryModuleLoad (internal/modules/cjs/loader.js:551:12)
at Function.Module._load (internal/modules/cjs/loader.js:543:3)
at Module.require (internal/modules/cjs/loader.js:650:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.get [as sass-boilerplate:app] (/usr/local/lib/node_modules/yo/node_modules/yeoman-environment/lib/store.js:39:27)
at Store.get (/usr/local/lib/node_modules/yo/node_modules/yeoman-environment/lib/store.js:62:39)

Can't run generator with success

Here the problem:

Welcome to the SASS Boilerplate generator.

This will scaffold out SASS (SCSS) styles for a new application.

? What is the site where the author can be reached? http://www.purplenetwork.it
? What is your gitHub account? kentoo+
? What is your Twitter account? kentoo
? (optional) What is your company name? Purple Network s.r.l.
? Would you like to include basic styles? Yes
? Would you like to include default Icomoon vector icon font? No
? Would you like to include animations for use with companimation? Yes
? Would you like to include nav styles? Yes
? Would you like to include a reset? Yes
? Would you like to include a type stylesheet? Yes
? Would you like to include a forms stylesheet? Yes
(!) #mkdir() is deprecated. Use mkdirp module instead. https://www.npmjs.com/package/mkdirp
(!) #mkdir() is deprecated. Use mkdirp module instead. https://www.npmjs.com/package/mkdirp
(!) #_ is deprecated. Require your own version of Lodash or underscore.string
events.js:141
      throw er; // Unhandled 'error' event
      ^

TypeError: /Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/app/templates/sass/partials/_forms.scss:28
    26|     @extend %transition-all;
    27|     cursor: pointer;
 >> 28|     font-weight: $<%= _.camelize(name) %>BaseFontWeight;
    29|     margin: 0 $<%= _.camelize(name) %>Margin 0 0;
    30|     color: invert($<%= _.camelize(name) %>SecondaryColour);
    31|     padding: $<%= _.camelize(name) %>PaddingSmall $<%= _.camelize(name) %>Padding;

Cannot read property 'camelize' of undefined
    at eval (eval at <anonymous> (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/ejs/lib/ejs.js:464:12), <anonymous>:34:24)
    at returnedFn (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/ejs/lib/ejs.js:493:17)
    at Object.exports.render (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/ejs/lib/ejs.js:315:37)
    at copy.process (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/mem-fs-editor/actions/copy-tpl.js:18:18)
    at applyProcessingFunc (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/mem-fs-editor/actions/copy.js:13:16)
    at EditionInterface.exports._copySingle (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/mem-fs-editor/actions/copy.js:56:24)
    at EditionInterface.exports.copy (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/mem-fs-editor/actions/copy.js:23:17)
    at EditionInterface.module.exports [as copyTpl] (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/mem-fs-editor/actions/copy-tpl.js:16:8)
    at SassBoilerplateGenerator.template (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/node_modules/yeoman-generator/lib/actions/actions.js:134:11)
    at SassBoilerplateGenerator.app (/Users/andrea/.npm-packages/lib/node_modules/generator-sass-boilerplate/app/index.js:155:8)

"yo sass-boilerplate" error - OSX Mountain Lion

User-MBR-ML:Project user$ yo sass-boilerplate

TypeError: Cannot read property 'bold' of undefined
at Object. (/usr/local/share/npm/lib/node_modules/generator-sass-boilerplate/node_modules/yeoman-generator/lib/util/common.js:5:56)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object. (/usr/local/share/npm/lib/node_modules/generator-sass-boilerplate/node_modules/yeoman-generator/lib/base.js:91:26)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)

"yo sass-boilerplate" error — Windows 7

TypeError: Cannot read property 'bold' of undefined
at Object. (c:\Users\Àlex\AppData\Roaming\npm\node_modules\gener
ator-sass-boilerplate\node_modules\yeoman-generator\lib\util\common.js:5:56)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object. (c:\Users\Àlex\AppData\Roaming\npm\node_modules\gener
ator-sass-boilerplate\node_modules\yeoman-generator\lib\base.js:91:26)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.