Setup your Development Environment with Sass, Scout, and Ruby on Windows

It takes a bit of configuration, patience and proper setup. Once you're all setup proper, it's smooth sailing!

To get setup, first you need to make sure you download and install Ruby on your Windows environment. PS - I just noticed that Scout's video demo is on a Mac, don't be alarmed it's the exact same on Windows!

  1. Head to RubyInstaller.org and download + install Ruby. Make sure you choose 64 or 32 bit (x86) and stay consistent with you selection for the following programs and installers also, otherwise you may get errors.
  2. Now, install the Development Kit from RubyInstaller.org.
  3. Once that's all setup proper, install Scout.
  4. Now, use the + sign to add a new project.
  5. In Scout, select the Sass directory of your project (Input).
  6. Select the CSS directory for Output.
  7. Now hit the play button.
  8. I got an error (#3214) when I did this, it was really frustrating. Don't worry though, it's a simple fix which will likely require a computer restart, so save all your files.
  9. Scout requires Java to run. Error #3214 means Scout is trying to load Java and it's just not there or Java is just not installed. Skip to #15 if you're all good.
  10. Head over to Java and make sure you're running the latest version, with the Java Development Kit (JDK).
  11. Next, here's where you actually need to locate a specific file called 'process_interaction.js' within your Scout Program Files. Mine is located at C:\Program Files (x86)\Scout\javascripts\app\process_interaction.js
  12. Open it up in a code editor, and allow administrator privileges.
  13. Around line 106, you'll see a function called javaDir, edit it as per where YOUR Java program is located. Here is a snippet for my setup:
  14.   function javaDir() {
        if(air.Capabilities.os.match(/Windows/)) {
          path = air.File.applicationDirectory.resolvePath("C:\Program Files (x86)\Java\jre1.8.0_65\bin\java.exe");
          if(!path.exists){
            path = air.File.applicationDirectory.resolvePath("C:\\Program Files (x86)\\Java\\jre1.8.0_65\\bin\\java.exe");
            if(!path.exists){
              path = air.File.applicationDirectory.resolvePath("C:\\Program Files\\Java\\jre1.8.0_65\\bin\\java.exe");
            }
          }
          return path;
        } else {
          return air.File.applicationDirectory.resolvePath("/usr/bin/java");
        }
      }
  15. Now, Scout can compile your sass styling in realtime. It's pretty sweet. Checkout the video on setting up your project with Scout in 2 minutes.
  16. If you don't already have a code editor, checkout Notepad++.

perm_identityAli Jaffar

schedule

visibility795 reads

labelMarked:

Did you enjoy this post?  


menu