CODEWITHSUNDEEP
buildsystemsasssublimetext2
Adonis K. Kakoulidis
Adonis K. Kakoulidis

Reputation: 5133

Set specified build system as default for a file type on sublime text 2

I have packages SASS and SCSS installed. SCSS provides the syntax highlight while SASS provides the build system i need for scss. My problem is, if build is set to automatic, it wont build the scss files if i press ctrl+b, so i have to always go back and reselect that option. Is there a way to make that build system to be the automatic one for scss?

Upvotes: 3

Views: 3250

Answers (1)

greg.arnott
greg.arnott

Reputation: 1642

Set it up using a build system and fire off with F7: http://readthedocs.org/docs/sublime-text-unofficial-documentation/en/latest/file_processing/build_systems.html?highlight=build for more information about setting that up.

UPDATED ANSWER

Copy the following:

{
  "cmd": ["sass", "--update", "$file:${file_path}/${file_base_name}.css", "--stop-on-error", "--no-cache"],
  "selector": "source.sass, source.scss",
  "line_regex": "Line ([0-9]+):",
  "osx":
  {
    "path": "/usr/local/bin:$PATH"
  },

  "windows":
  {
    "shell": "true"
  }

}

In Sublime Text, go Tools > Build System > New Build System > Paste Give it a name. Bingo.

Simpler Way

SASS Support in Sublime

Adding Support for near everything.

Simplest Way

Why DIY when you do not need to.

Want to have the site update in an open browser every time you save?

  1. Generally a good must to have Ruby Git and Python installed.

  2. Install Nodejs. (win) the .msi download from main site works well and includes npm Now you have access to the 'gem' and 'npm' package managers. Things get easy now, although I may as well write it out longwinded.

  3. Compass:

    gem update --system gem install compass // can now use this command to build a sass-based project compass create myFirstWebsite // ..installs in "/myFirstWebsite"..

  4. Install the Grunt client (global flag)

    npm install grunt-cli -g

now have access to the wealth of Grunt automation packages ie:

npm grunt-contrib-jshint --save-dev

"dev" flagged - applies to your local project only (current and sub folders) also, listed as a "devDependency" in package.json, which means it'll not be packed with your project on a distro/prod build

  1. Time for some simple awesome... Yeoman

    npm install yo -g

installs yeoman (yo commands) a heap of other essentials and Bower - twitter's response to Node / Gem etc Bower looks after package dependencies.

AND THE AWESOME?

// make a new folder. cd into it, and type:
yo webapp

// There are multiple 'generators' you can install with yo.
// webapp is the one most suitable for front-end dev / web app building

// other things you might want before you start.. maybe underscore:
bower install underscore
// adds '_' to the set-up as a dependency

// These commands will brighten your day:
grunt test      
// comprehensive testing of app
grunt server    
// This part you'll love! Starts server and launches app in browser
// - includes live-refreshing... save a file, and all required builds etc
// are preformed (damn fast) and automatically refreshes browser.
// Yup, 'grunt server' = project-wide equiv to 'compass watch'
grunt
// Build application for deploy. Not only do you get minification and concatenation;
// also optimize all your image files, HTML, compile your CoffeeScript and Compass files, 
// if you're using AMD, will pass those modules through r.js so you don't have to.

Upvotes: 3

Related Questions