how to setup theme development

How to set up theme development

Setting up RubyMine

First you need to install File Watchers for RubyMine This can be done from: RubyMine > Preferences > Plugins > Install JetBrains Plugins

There search for File Watchers, install and restart RubyMine

Now you're all set on using file watchers

Writing a custom watcher

Go to RubyMine > Preferences > File Watchers

Click plus button to add new watcher

Fill in name and description to your liking These are the settings to use:

Show console: error (will throw up the console when there are parse errors)

File Type: SCSS

Scope: Project Files

Program: /bin/bash

Arguments:

-login -c "rvm use 2.1.1@shoperb && scss --no-cache --update $ProjectFileDir$/app/themes/default/scss/style.css.scss:$ProjectFileDir$/app/themes/default/stylesheets/style.css"

The safest ruby version and gemset to use here is the one that Shoperb uses. Of course adjust the source and target directories to the theme that you are developing.

Working directory: $ProjectFileDir$ Unfortunately this has no effect since the RubyMIne watchers don't know how to automatically use gemsets :(

Output paths to refresh: $ProjectFileDir$/app/themes/default/stylesheets/style.css This will update the compiled file in RubyMine

Setting up the rails console

These instructions can be found in .irbrc in the Shoperb project folder

add next lines into ~/.irbrc

def load_irbrc(path)
  return if (path == ENV["HOME"]) || (path == '/')
  load_irbrc(File.dirname path)
  irbrc = File.join(path, ".irbrc")
  load irbrc if File.exists?(irbrc)
end
load_irbrc Dir.pwd # probably should stay at the bottom

And in the .irbrc folder in the Shoperb project root there is this: Shop.current = Shop.first

If the shop you want to load is not this, then adjust it.

This will automatically load the current store in the rails console.

Importing changes in the theme

If you did everything in the previous step. Then updating the current theme is done with: Shop.current.theme.send(:import)

You need to run this every time you change stylesheets or javascript files.