Not able to install grunt preprocessor - gruntjs

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.

Related

Grunt build fails in travis - "Cannot find any-promise implementation"

I'm using travis to test my code. Recently the grunt tasks have started to fail without no change being made to anything involved with grunt. (The new commit which is tested contains just very minor changes in two PHP files.)
Here is the part of log from travis:
$ grunt build:app
Running "typings:default" (typings) task
Warning: Cannot find any-promise implementation nor global.Promise. You must install polyfill or call require("any-promise/register") with your preferred implementation, e.g. require("any-promise/register")("bluebird") on application load prior to any require("any-promise"). Use --force to continue.
Aborted due to warnings.
The command "grunt build:app" exited with 3.
I tried to search for that warning message but couldn't find anything useful.
One more thing: When I run grunt build:app locally on my pc it works just fine.
Thanks for your time :)
I had the same problem when I started using grunt-typings. Worked locally and didn't work on my CI server. Ended up fixing it by doing what the error message suggests:
npm install bluebird
npm install any-promise
In GruntFile.js:
require("any-promise/register")("bluebird");
Update your node.js version to >v0.12. To check your version of node.js use node -v. The documentation of any-promise explains:
Node.js versions prior to v0.12 may have contained buggy versions of the global Promise. For this reason, the global Promise is not loaded automatically for these old versions. If using any-promise in Node.js versions versions <= v0.12, the user should register a desired implementation.

Use gulp locally outside node

I would like to use gulp in my Wordpress project. Is it possible to execute gulp functions outside a node JS project?
I'm running on OSx, but couldn't find anything on the internet about it. Or do I'll have to use another lib like Grunt?
Yes, the main language of your project doesn't affect whether or not your can include some node.js dependencies and run them. You will need to have gulp installed and have a gulpfile.js in your project, and then you can run it.
You could install gulp globally on the server (npm install -g gulp), but I recommend creating a package.json file (using npm init) in your project, so that your node.js dependencies are tracked in your version control, and installing gulp with npm install --save gulp (inside your project's directory). Since gulp won't be installed globally in that case, you will need to use "$(npm bin)"/gulp from a directory inside your project to run it.
I use Yeti Launch from the Zurb foundation for the same setup (no node installed on my Mac).
When you run it, it will create a Foundation frame but you can do the following:
Stop the project it creates from within its interface,
Delete the files it creates and replace with yours
Leave the project it shows in the interface
Leave the "node_modules" folder it creates
Start the project again
This will run your Gulp file.
The only issue is installing node modules. For this, I look at any error messages it gives regarding missing modules and copy these into the "node_modules" folder from Github
The short answer is no. Gulp is distributed as a npm package and has node.js as a dependency BUT that doesn't mean you can't use it outside of a node.js project.
The only real need for Gulp on a wordpress project would likely either be at the theming layer or if you were doing a custom plugin. Assuming you are making a theme, some of them use Gulp extensively.
I've used the Roots ecosystem's Sage theme successfully on a number of projects. It has node/npm dependencies but they are all included if you use the theme. Check out their Gulp file - it's probably close to what you are philosophically looking for.

Why does grunt allow global installations?

I've installed both the grunt-cli and grunt globally using the -g option.
However when I try and run grunt I get this error:
grunt --gruntfile /Users/a/root/config/Gruntfile.js
grunt-cli: The grunt command line interface. (v0.1.13)
Fatal error: Unable to find local grunt.
If you're seeing this message, either a Gruntfile wasn't found or grunt
hasn't been installed locally to your project. For more information about
installing and configuring grunt, please see the Getting Started guide:
http://gruntjs.com/getting-started
This is confusing as it seems to say that you are suppose to do a local install.
It seems contradictory actually. I clearly have a grunt file in place.
Grunt-cli is installed globally so that the grunt command is available to be run from any location on your system. Without the global installation, you would need to rely on somewhat abstract methods of running local grunt installs (npm run-script and friends), which are clunky for this use.
The entire point of the global install is only to load and run a local Gruntfile.js using the locally installed version of Grunt. The error message indicates this:
either a Gruntfile wasn't found or grunt hasn't been installed locally to your project.
In other words, to run Grunt, you need to create a Gruntfile.js and you must have a local copy of Grunt installed to your project alongside the file. The CLI is just there to kick off the process without troublesome fiddling.

Find/reduce scss errors in media query mixin

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 ?

Grunt Compass/SCSS not compiling

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

Resources