All the sass files in my application are compiled into one big css file, but it's become rather bloated. In order to monitor where the bloat is coming from I've written a batch file to go through each individual sass file and compile it as a separate stylesheet. The problem is that each stylesheet is dependent on one in particular one - _mixins_and_vars.scss - which is only included once in my over-arching styles.scss stylesheet, and not referenced at all in the other sass files.
Is there a way I can temporarily import extra sass stylesheets while compilation is running?
Here's a suggestion: in your batch script,
insert reference to _mixins_and_vars.scss into your target file
compile that
remove reference
PROFIT!
:-)
Related
I need some help with Sublime 4 please.
At the moment I use Prepros to compile my css.
I am trying to mimic the process of Prepros so i can us Sublime only.
I have:
installed the SASS package,
created build system: BuildIntoNewFolder
selected Save All On Build
This is my setup:
I wrote my scss in hidden scss file here:
/assets/scss/_style-header.scss
and
/assets/scss/_style-footer.scss
The hidden scss are imported to:
/assets/scss/style.scss
The style.scss are the compiled to:
/assets/css/_style.css
This all happens by simply saving _style-header.scss
Thank you
I'm having trouble getting SASSC to compile my scss when I point it at a directory containing many scss files. If I specify just the top-level file that imports all the others, then it compiles fine, but that breaks the watch functionality of the build tool I'm using (lein-sass). This is because if I only tell it to watch the top-level file (rather than a whole directory), then it only picks up changes in the top-level file which we rarely update.
It looks like the problem is that it's not compiling things in the correct order, so dependencies are missing.
Is there something about how I should structure my scss files so that SASSC can figure out which file to compile first?
My structure is something like:
my-app.scss
pages/page1.scss
pages/page2.scss
components/common.scss
The my-app.scss file imports all the others, but they all depend upon the common.scss file in the components folder.
When running the middleman build command, all the stylesheet files specified in the set :css_dir are compiled to .css extensions.
My question is: How can I exclude a .scss file from the compilation process (so that the content remains the same and doesn't compile to CSS), but can it be available in the build directory after middleman build?
A question was raised whether it's similar to ignoring the .scss files in Compass compilation: It's similar in nature, but unlike that process, which is more along the line of "ignore this file during the compilation", this question is specific to middleman, which is "ignore this file during the compilation, but do not ignore it during the build process".
Yoy may use the _underscore prefix to exclude files from Sass compilation. It's intended for usage with includes/partials, but will do the job. Sass won't compile those files until you #include them.
After that, simply copy the needed files to your build directory. The :after_build hook should be the right place for that:
https://middlemanapp.com/advanced/custom_extensions/#after_build
I'm trying to learn to use SASS to expand my web development skills but I've run into a problem. I'm running Windows 7 , I have installed both Ruby193 and SASS gem and I'm using Netbeans 8.0 as my IDE.
My system path points to C:\Ruby193\bin and I can type ruby -v from my command prompt without error, so I believe that is set up correctly.
Under CSS Preprocessors in project properties I have input set to /scss and output set to /css. In Configure Executables I have SASS path set to C:\Ruby193\bin\sass.bat. From what I have read, this is correct.
I've also got a simple project set up with two directories css and scss as well as an index.html with test text and a link to css/style.css in the header. In my scss directory I have style.scss with some test code. My css directory is empty. It is my understanding that when I compile SASS should generate a css/style.css from style.scss, however it does not.
Both Netbeans - installing SASS and Does Netbeans generate a separate CSS file when saving a SASS file? have the same problem I do, but neither solution seems to work for me. Could anyone offer me some help? I've also attached an image of my settings.
Thanks in advance for any help you can offer!
http://i.imgur.com/atyHT84.png
1) create css/styles.css.
2) type "--style compact" and check "Compile Sass files on save" in the CSS compact.
We have started to use Sass with Compass for a new project. Currently I'm locally compiling scss to css and committing generated css file to svn (installed in test server) only. And because of that only I can work on Sass files and I want to give the ability to edit sass files to other developers too. and I would also like to setup the workflow in the manner we can work from anywhere, work on .scss file and compile (on save/commit) on server. without having Ruby, Sass gem, compass gem installed on local PC.
How to install sass, compass, chunky png on LAMP server and How to allow everyone to edit and compile .scss to .css file?
and we are also using SVN for version control.
If scss can be compiled to css in non-interactive mode
and
If compilation tools can be installed on test-server
you can try
Save real sources (*.scss) in repository
Post-commit hook in addition to current tasks (export of update WC for reflecting changes in repo) will get task of compiling scss
PS: Can't see any problem here - obvious task and obvious (single!)solution