Is there a way to setup autoprefixer in a Volt application?
I haven't tried it myself yet, but you can probably use https://github.com/ai/autoprefixer-rails#sprockets and do the sprockets setup instructions from a .rb file in config/initializers/server/ If you get it working, let me know.
Try something like this:
require "autoprefixer-rails"
AutoprefixerRails.install(Volt.current_app.sprockets)
Related
I am trying to configure SASS/SCSS Autoprefixer in phpstorm and no solution here or anywhere on google is working for me, any help is appreciated...
I have tried many options including making a custom file watcher and using postcss-cli autoprefixer, but not able to get it right.
As it's written in this comment, there is no built-in support for autoprefixer, and it can hardly be expected in near future. If you miss it, please vote for WEB-37.
You can install the autoprefixer (npm install postcss-cli autoprefixer -g) and set it up as a file watcher, for example
You can also try using sass-prefix-mixins in your code
I've been using Compass to compile Sass in my project, but it is now deprecated and no longer maintained so I want to move away from using Compass. The project uses PHP and Laravel, so I would like to use Laravel Elixir for compiling the Sass files instead.
Is there a way to transfer my .scss files from Compass to Elixir without going in and changing all the places in my Sass code that I use Compass helpers, or do I need to more or less re-write my Sass files? There are a ton of them, so I would love to avoid that.
On the suggestion of my co-worker, what I tried was to add the compass files to my resources/assets/sass directory (includes compass/css3, compass/layout, compass/reset, compass/typography, and compass/utilities, as well as several other .scss files included in Compass. The hope was that by including these files, the functions of Compass would still apply outside of it.
When I try to compile with gulp, the error I'm currently getting (although I'm guess I'll run into another one once this is fixed) is:
>> Sass Compilation Failed: resources/assets/sass/compass/_support.scss
Error: Undefined operation: "prefix-usage(browser-prefixes(browsers()), css-transitions, (full-support: true), (partial-support: true)) gt 0.1".
on line 324 of resources/assets/sass/compass/_support.scss
>> #if $usage > $threshold {
------^
My guess is that I will need to go ahead and remove the Compass stuff from the Sass code manually, but I'm hoping someone else has a better solution for me! Thanks.
I've just started using Laravel 5.0 and noticed it comes installed with Gulp and it's own library called Elixir. Looks good, however I'm having trouble including libraries such as Susy and Breakpoint to run with it.
In a typical Gulp setup I would pipe it in my styles task like this using gulp-ruby-sass:
.pipe(sass({ style: 'compact', require: ['susy', 'breakpoint'], "sourcemap=none": true }))
However, I've been unable to do something similar with Elixir. Has anyone come across a solution for this?
Currently the Elixir style task in my gulp file is like so:
elixir(function(mix) {
mix.sass('main.scss');});
Any advice would be greatly appreciated.
Thanks!
You can pass in node-sass options as the third parameter.
elixir.extend('sass', function(src, output, options)
So something like...
elixir(function(mix) {
mix.sass('main.scss', undefined, {
outputStyle: 'compact'
});
});
It doesn't seem like susy CSS framework work out of the box with gulp-sass in elixir. I had to install the "laravel-elixir-compas" module (https://github.com/rynocouse/laravel-elixir-compass). The Compass extension to elixir allows you to use susy and breakpoint.
You just need to define the import in config.rb
require 'breakpoint'
require 'susy'
And then you should be good to go..
I had "Compass Compilation Failed!" error which I was able to fixed by simply specifying the options for compass.mix() (refer to https://github.com/rynocouse/laravel-elixir-compass for options)
Hope that helps anyone with a similar issue
I cloned a sinatra app https://github.com/trivektor/Backbone-Hangman with a file set up like you see in the image below. In the terminal, I ran the ruby hangman.rb commandbut I got the error
`require': no such file to load -- sinatra/static_assets
Would static_assets refer to the images and css in the public folder? Is static_assets the sinatra way of including those files? Can anyone explain what might be the problem?
Looks like that example needs the sinatra-static-assets gem.
gem install sinatra-static-assets
fixes the problem.
I'd love to use Bourbon with LiveReload but I can't seem to get them to work together. Anybody successfully made these two play nice?
If you use the 'Run a custom command after processing changes' option rather than the standard compilation option, then you can use the commands as detailed on the readme.
# Example (project root directory)
sass --watch stylesheets/sass:stylesheets -r ./stylesheets/sass/bourbon/lib/bourbon.rb
I wrote a blog post covering this.
If you install the latest version (3.0.0) of Bourbon and install bourbon into your compass sass directory:
bourbon install --path ./sass
You can then use LiveReload with one small tweak. You will need to replace LiveReload's version of SASS with at least 3.2.3, since Bourbon requires this.
Instructions on how to replace LiveReload's default SASS version can be found here: http://carl-topham.com/theblog/post/changing-version-sass-livereload/
This seems to work for me.
I've been told you can get it to work by passing the lib/bourbon.rb file into the "Run a custom command" option in LiveReload. See attached image.