A Python script to take the redundancy out of executing the sass --watch
command. Contributions welcomed and appreciated.
Clone the repo into the directory of your chosing and run the setup file (with no options).
git clone https://github.com/goodguyry/bella.git && cd bella && source setup
Download the files into the directory of your chosing and run the setup file (with no options).
curl -#L https://github.com/goodguyry/bella/tarball/master | tar -xzv --strip-components 1 --exclude={README.md,LICENSE} && source setup
Alternatively, you can run ./setup
from within the project root to set the files into place. There are three options available:
-h , --help |
Prints usage information |
--dev-mode |
Symlink files in place (default is copy) |
--no-global |
Supress copying/syncing the example global file |
During setup, .bella_global is copied to your home folder and bella is copied to ~/.bin (the directory is created if it doesn't already exist).
Once in ~/.bin, Bella can be run from the root of your site:
bella
The following optional arguments are available to override your configuration files:
bella -w <watchFile> -p <processedFile> -e <environment> -s <style>
Use -d or --directory to watch an entire directory.
-w , --watchFile |
The file (without extention) you want Sass to watch |
-p , --processedFile |
The filename (without extention) you want Sass to give the processed (CSS) file |
-e , --environment |
Switch away from your default environment |
-s , --style |
One of the Sass style options |
-d , --directory |
Tells Bella to watch the directory paths instead of individual files |
If you've got your configuration files set right, you should only need the options when switching environments...
bella -e deploy
... or if you want to watch a file other than the default input file...
bella -w print
... or if you want to change the name of the processed file...
bella -p main
... or to watch an entire directory.
bella -d
The settings are applied in this order:
- bella_global
- bella.config
- Optional command line arguments
Screenshot (based on the configuration in the following section):
The configuration files (bella_global and bella.config) are python dictionary files.
bella_global: This is a great place to define your environment settings, as those usually won't change from project to project.
# From bella_global
# Global configuration file
# Served from home directory
# If not present in the user's home directory,
# all configuration setting must be in bella.config
{
'defaults': {
'environment': 'develop',
'precision': 4,
'watchFile': 'core',
'addMinToFilename': True,
'addMaxToFilename': True
},
'develop': {
'style': 'expanded',
'lineNumbers': True
},
'deploy': {
'style': 'compressed',
'lineNumbers': False
}
}
bella.config: Project-specific settings to override the global defaults. This file is required and must be in your project root.
# From bella.config
# Local configuration file
# Required to be served from the project's root directory
{
"paths": {
"cssPath":"_/css/",
"sassPath": "_/sass/"
}
}
Bella-specific settings
environment
is the default environment; the environment can be either develop or deploy.
watchFile
is the file (without extention) you want Sass to watch; the processed (output) file will be named the same as the watchFile unless overridden by the -o
command line option.
addMinToFilename
and addMaxToFilename
will append min or max (respectively) to the processed CSS file's name; max when not compressed, min when compressed (e.g, default.min.css).
paths
are the relative paths (from the root) to the Sass and CSS files (with trailing slashes).
Sass-specific settings (from the Sass reference)
precision
sets the number of digits of precision. For example, if this is 3, 3.1415926 will be printed as 3.142.
style
should be one of the following:
- nested (default)
- expanded (typical human-made CSS style)
- compact (takes up less space than Nested or Expanded)
- compressed (takes up the minimum amount of space possible)
lineNumbers
: When set to true, causes the line number and file where a selector is defined to be emitted into the compiled CSS as a comment. Useful for debugging, especially when using imports and mixins.
##FAQ
Probaby.
This was originally written as a Bash script, to get aquainted with Bash; this was the first project idea that came to mind. Once I was finished, I decided it needed to be rewritten in a more accessible way (the Bash script required Bash 4). So here we are... I should probably mention that this is my first Python script/project.
I just wanted a bare-bones, dead simple way of doing it. I definitely understand this isn't for everyone. Frankly, it's for me, but you're free to use it if you find it useful.
Bella is my 7-year-old Wirehaired Pointer. She's the bacon to my eggs; the peanut butter to my jelly.
Note: This is my first Python script, so I am probably using it in naive ways - especially regarding it's distribution and installation. I appreciate any help or guidance you can contribute.
Copyright (c) Ryan Domingue. Distributed under MIT License.