jQuery plugins in brunch.io - backbone.js

I'm developing an application using brunch.io and want to use a jquery plugin (in this case the jQuery Waypoints plugin).
What is the recommended way of doing this?
I know it is possible to get the plugin through
npm install waypoints
But that doesn't make $('.my-div').waypoint() work in my app.
Thank You

place the plugin into vendor/scripts and that’s all

Brunch now supports Bower, so adding Waypoints can be done like so:
bower install --save jquery-waypoints
As of version 2.0.3 Waypoints doesn't specify a main in its bower.json, so you'll need to specify a main in the overrides section of your app's bower.json to indicate which file Brunch should use as the entry point to the installed package, e.g. "jquery-waypoints": { "main": "waypoints.min.js" }.
Of course, this will not work if you're using a version of Brunch without Bower support.

Related

setting up Backbone with yarn

I recently added various libraries with yarn like so:
yarn add jquery backbone underscore bootstrap
With bower there was a way to list out the paths that each of these libraries was in, how do I do this with yarn?
yarn list --paths only gives me the names of the libraries and the version number.
The problem is you are trying to utilize yarn the way bower used to work, but yarn list --paths will only give you the dependencies and version number as you noted.
I think what you need to understand is that you are not using bower_components, you are using node_modules. With that said, your paths are probably something like /node_modules/bootstrap/dist/css/bootstrap.css. Open your node_modules folder and you will see what I am talking about.

How should I include aws-appsync in AngularJS project

I am working on a AngularJS project that uses bower as package manager and gulp to inject the dependencies into the index.html file. I am not very familiar with both of these tools.
I now want to use AWS AppSync, but it is not available as a bower package.
Currently the AWS SDK is specified as a file dependency in bower.json as:
"aws-sdk": "./thirdparty/script/aws-sdk-2.69.0.min.js",
When I install aws-appsync with npm npm install aws-appsync the node_modules folder for aws-appsync contains multiple js files in the lib directory.
How can I include these with bower or is there another way to do this altogether?
I am currently unable to change much of the build and dependency management process so any suggestions working with the current tools would be much appreciated.
Thanks for reaching out!
The Bower team itself has recommended that people migrate to npm or yarn, and so aws-appsync has not been pushed to Bower.
It might be worth investigating whether you can install directly from github using something like...
bower install <github url>.git
... and install directly from the appsync-sdk github repo.
In the end I hacked together an interim solution until I can move the whole project over to npm and browserify.
I added the aws-appsync package using npm and required it in a new file. This file is then passed through a gulp task that uses the browserify plugin. The added file is then included into the rest of the build process as before.

Install bower component (angular-qr-scanner) using Meteor

I'm trying to install Angular QR Scanner in my Meteor app. It seems the only way to install it is using Bower, however bower support for Meteor seems to be deprecated now for 1.3. I tried installing using npm install however I receive an error that qrcode.decode is not a function, despite importing both files needed.
Is there another way to install bower components using Meteor?
Ended up just importing the plain javascript implementation with html5-qrcode rather than using an angular directive.

Glyphicons not working with bootstrap-sass in Angular

I've had an issue with GlyphIcons not loading correctly when using this bower component: https://github.com/twbs/bootstrap-sass
I tracked down the issue to finding an #at-root element being injected into my CSS file.
I was able to get glyph icons working by removing the element, IMHO this is a damn useless SASS selector that does not add much value in the context it was being used.
Once I tracked down the issue, I then looked at the issues register in their GIT repository and found this item that suggested that the version of SASS compiler needed to be at least 3.3. See: https://github.com/twbs/bootstrap-sass/issues/953.
I am on windows and just using bower components so I did a re-installation of Boostrap-Sass
bower install bootstrap-sass -g
But this did not resolve my problem.
I'm not sure what the issue is, I hope someone has a solution to getting the latest bootstrap sass working on a windows/node environment.
For now I have fixed the issue by find the 2 references to #at-root in folder bootstrap-sass-official and just removing them.
Installed the latest version of Ruby
I followed this link http://awordpress.net/blog/install-sass-compass-manually-windows/ for doing manual install of SASS.
I'm not sure why I could not get compass to install (as per the link above) but it did not matter as the firth point in that link was all I needed to get SASS updated on a windows
gem install sass

Angulars - Choose which version of angularjs Yeoman must install

My question is very basilar, but I didn't found anything in the web: how can I tell Yeoman to use a specific version of Angularjs instead of the latest available?
Thanks
You can force Angular's requested version in generated bower.json file, and then running bower install...
Then please be sure all other dependencies in bower.json file are not broken by the previous downgrade, possibly downgrading other libraries versions, too...

Resources