We've been working with Neat framework for 6 months and love it.
However suddenly we have a critical problem with one of their excellent mixins which we are entirely dependant on for media queries.
Here's a link to the file.
https://github.com/thoughtbot/neat/blob/master/app/assets/stylesheets/grid/_media.scss
Heres the docs for the mixin.
http://thoughtbot.github.io/neat-docs/latest/#media
We've called it in our sass files almost 300 times so its pretty essential, although we mostly only use the first parameters e.g. media( max-width $small-screen)
Although we have also used it in some of the Refills navigation modules which use it in a more advanced way
http://refills.bourbon.io/
Don't know what the error is because gulp-sass and browser-sync crash without sending error messages to the console like it normally does with the way we have it set up.They only crash when this mixin is loaded. Don't know what causes the error
If I start removing the mixin we get error reporting back and gulp-sass doesn't crash any more. ALthough we get errors from all the files that call the mixin.
I've also tried the following
Completely deleting the node_modules directory and doing a fresh npm install
Doing a npm uninstall of gulp and gulp-sass, then a fresh npm install
Doing a global install of node-sass, and doing a global uninstall of node-sass.
Doing a npm rebuild node-sass from within the node_modules/gulp-sass directory
Does anyone have any suggestions/ ideas / solutions ?
Related
I am using grunt version 1.0.1. While installing grunt preprocessor, it is returning the error as:
npm WARN grunt-preprocessor#0.6.1 requires a peer of grunt#0.4.x but none was installed.
Please let me know, how to resolve this issue.
I need this to handle loading of the certain script and CSS files in a HTML based on environment, development/production.
Is there any other better way other than grunt preprocessor to handle loading of certain script / CSS for development and production.
Our team is starting to use LESS to write CSS. I am using atom.io and there is a plugin to auto-compile LESS to CSS on save. (Link to plugin) However, some team member prefer to use sublime. While there are also similar plugin for sublime, it requires npm for installation. Our team mainly use PHP with composer for package management, so installing npm just for a plugin seems a bit overkill. Is there any other way to do LESS auto-compile on save with sublime?
Not that I know... :(
There is a python library that compiles less to css. (sublime plugin are written in python) though
So, all you've got to do is: write this plugin using lesspy
If you are a bit patient, I am trying to make this plugin, it shouldn't be to hard, I'll keep you in touch.
Matt
EDIT: Here's the plugin: st-py-less. Follow the (simple) instructions to install it. Only working with Sublime Text 3.
They could probably use SublimeOnSaveBuild
But npm and Composer aren't really comparable here. Composer manages a project's dependencies, npm provides easy access to hundreds of thousands of community-maintained packages. Using Composer isn't a reason to not install npm.
And the package you install when you "install npm" is under 14MB. It also comes included with Node.js. The "Installation Requirements" for sublime-less2css, by listing "install node" and "install npm" as two separate steps are misleading, and the provided links aren't that helpful. Here's the official documentation for Installing Node.js and updating npm
This is getting beyond the scope of your question, but to have a single team-wide editor-agnostic setup for automatically compiling LESS to CSS you could use Gulp. If you aren't familiar with Gulp, follow CSS-Tricks' Gulp for Beginners from the start up through the "Watching Sass files for changes" step. (Note that the guide teaches you how to use gulp-sass to compile Sass to CSS; in your case you'd just use gulp-less instead.)
Calling grunt-eslint causes a Cannot find module 'eslint-plugin-react' error that doesn't happen when calling eslint directly from the command line.
I have eslint-plugin-react installed globally.
Is there an easy way to make grunt eslint behave the same way as eslint?
Assuming you don't want to install the node module locally for some reason, I can think of two options. 1. Use grunt-exec within your grunt file to run eslint, or 2. As per the answer in the link below setup a symbolic link to your global node modules folder:
How to use grunt-html installed globally?
I currently compile LESS with lessc (version 1.7.0) fine, but when I add --source-map, I get
SyntaxError: Cannot find module 'source-map' in /home/me/my.css
I suspect this may be because I did not install LESS using npm. How can I get source maps working?
The requirement (sorry): This must be able to be versioned entirely in a VCS, and not use npm for setup.
If you're not downloading the whole package at least make sure you have the libraries LESS needs. Checking their repo you can see source-maps is listed there so you might need those files too.
Here's the link: https://github.com/less/less.js/tree/9d3ef59cf818691cd52410879e7152e7d589de32/lib
Hope it helps.
I'm pretty new to whole Grunt and SCSS workflow stuff and recently configured Grunt with a WP theme development that run under MAMP. Installation of Node, NPM, Grunt and its dependencies went smooth. However, when i make a change on .SCSS files, it doesn't seem to be reflecting the changes to the .CSS files due to following warning from compass:
Running "compass:app" (compass) task
LoadError on line ["55"] of /Library/Ruby/Site/2.0.0/rubygems/core_ext/kernel_require.rb: cannot load such file -- susy
Run with --trace to see the full backtrace
Warning: ↑ Use --force to continue.
Aborted due to warnings.
Not exactly sure what's up but obviously a communication issue between Ruby and Compass?
Whether it be incorrect version mapping or paths..?
I researched and attempted following:
Uninstalled the current and installed new Ruby
Installed RVM (didn't use it, just installed it)
Upgraded compass to the latest version 0.12.2 and made sure this version is reflected in package.json for grunt.
Any pointers and advise highly appreciated!
I don't know if this is an option but you might look at PrePros (https://github.com/sbspk/Prepros). I tried for a while to setup the raw/core setup you are working with but it was just always quirky - not to mention super tedious to setup. PrePros takes all the pain away! Just a suggestion.
Related/Reference link: https://stackoverflow.com/questions/19866550/sass-haml-compile-on-prepros