I am following www.angular-meteor.com tutorial on a windows computer.
But when I run meteor in console I only see:
A blank screen besides socially...
So it seems like some angular packages does not work with Meteor 1.3.1.
Here is output from meteor list:
accounts-password 1.1.7 Password support for accounts
angular 1.3.9_2 Everything you need to use Angu...
angularui:angular-google-maps 2.3.2 angular-google-maps (official)
angularui:angular-ui-bootstrap 0.13.0 Native AngularJS (Angular) direc...
angularui:angular-ui-router 0.2.15 angular-ui-router (official): Fl...
angularutils:pagination 0.9.1_2 Magical automatic pagination fo...
check 1.1.3 Check whether a value matches a p...
dotansimha:accounts-ui-angular 0.0.4 AngularJS wrapper for Meteor's Ac...
email 1.0.11 Send email messages
es5-shim 4.5.9 Shims and polyfills to improve EC...
jquery 1.11.7 Manipulate the DOM using CSS sel...
less 2.5.7 Leaner CSS language
meteor-base 1.0.3 Packages that every Meteor app needs
mobile-experience 1.0.3 Packages for a great mobile user ...
mongo 1.1.6 Adaptor for using MongoDB and Min...
reactive-var 1.0.8 Reactive variable
standard-minifier-css 1.0.5 Standard css minifier used with M...
standard-minifier-js 1.0.5 Standard javascript minifiers use...
tmeasday:publish-counts 0.7.3 Publish the count of a cursor, in...
tracker 1.0.12 Dependency tracker to allow reac...
twbs:bootstrap 3.3.6 The most popular front-end framew...
For example angularui:angular-ui-router seems not be working. But it works with meteor 1.2 version.
Is there someone out there that have the same problem? Maybe a solution as well?
Best Regards
EDIT
Removing dotansimha:accounts-ui-angular resulted in that I can see the map and search box. But The app is still broken. No parties are shown, pagination does not work and so on... Any ideas how to fix it?
I think I got it working now:
meteor list
accounts-password 1.1.7 Password support for accounts
angular-meteor-auth 1.0.1 Angular-Meteor authentication module
angular-templates 1.0.2 Compile angular templates into th...
angular:angular 1.5.3_1 AngularJS (official) release. F...
angularui:angular-google-maps 2.3.2 angular-google-maps (official)
angularui:angular-ui-bootstrap 0.13.0 Native AngularJS (Angular) direc...
angularui:angular-ui-router 0.2.15 angular-ui-router (official): Fl...
angularutils:pagination 0.9.1_2 Magical automatic pagination fo...
check 1.1.3 Check whether a value matches a p...
dotansimha:accounts-ui-angular 0.0.4 AngularJS wrapper for Meteor's Ac...
email 1.0.11 Send email messages
es5-shim 4.5.9 Shims and polyfills to improve EC...
jquery 1.11.7 Manipulate the DOM using CSS sel...
less 2.5.7 Leaner CSS language
meteor-base 1.0.3 Packages that every Meteor app needs
mobile-experience 1.0.3 Packages for a great mobile user ...
modules 0.5.2 CommonJS module system
mongo 1.1.6 Adaptor for using MongoDB and Min...
pbastowski:angular-babel 1.3.2 Babel compiler and ng-annotate fo...
reactive-var 1.0.8 Reactive variable
standard-minifier-css 1.0.5 Standard css minifier used with M...
standard-minifier-js 1.0.5 Standard javascript minifiers use...
tmeasday:publish-counts 0.7.3 Publish the count of a cursor, in...
tracker 1.0.12 Dependency tracker to allow reac...
twbs:bootstrap 3.3.6 The most popular front-end framew...
So I do use accounts-ui-angular!
I followed this link
What I did was:
First:
Remove the angular meteor package you installed via atmosphere: meteor remove angular
Make sure you have the ecmascript package installed. If you had the atmosphere angular package installed previously you may have removed it after getting a notice that multiple compilers were trying to handle files with .js extension. So check out meteor list and if ecmascript isn't there do: meteor add ecmascript
Install angular and angular meteor via npm: npm install angular angular-meteor --save
List 'angular-meteor' as a module dependency for your main module: angular.module('myApp', ['angular-meteor']);
meteor remove ecmascript
meteor add modules (ecmascript implies modules so you have to add it manually if you remove ecma)
meteor add pbastowski:angular-babel
Note that I do not need to import angular in app.js (no import angular from 'angular'; or import 'angular-meteor';)
Now:
Hope that helps if someone have the same problem:)
I found that the problem is the incompatibility with this package:
meteor remove dotansimha:accounts-ui-angular
Don't forget to remove the dependency 'accounts.ui' on 'app.js'
Just removed and the result:
Possibly the problem is why somehow this package uses the "blaze-html-templates"
Related
I am trying to update jQuery for Drupal 7.87 to version 3.6.x. The jQuery_update module (7.x-3.0-alpha5)installed and the highest JQuery version I can pick from the dropdown list is 3.3.
Does anyone know if Drupal 7.87 support JQuery 3.6.x? If yes, how can I upgrade it properly?
Thanks
The module jquery_update allows to use "recent" versions of jQuery within Drupal but does not provide the latest versions because the changes tend to break Drupal 7 core JS.
A solution is to "side load" the newer version using the module jQuery Multi :
jQuery Multi allows you to load an extra version of the jQuery library
in parallel to Drupal's version, without conflicting with Drupal's
version.
For instance, if you're loading jQuery-3.6.0, the alias will be jq360, and you can use it in your scripts by wrapping your code as follows :
(function($){
// Code here
// ....
})(jq360)
I am in and out of a project with Meteor, trying to wrap my head around this framework (documentation is comparable to Ruby... just terrible and fragmented), and I get this error :
While determining active plugins:
error: conflict: two packages included in the app (barbatus:angular2 and
templating) are both trying to handle *.html
And this is my installed packages :
autopublish 1.0.4 (For prototyping only) Publish the entire d...
blaze-html-templates 1.0.1 Compile HTML templates into reactive UI wit...
ecmascript 0.1.5 Compiler plugin that supports ES2015+ in al...
es5-shim 4.1.13 Shims and polyfills to improve ECMAScript ...
flemay:less-autoprefixer 1.1.0 The dynamic stylesheet language + Autoprefixer
insecure 1.0.4 (For prototyping only) Allow all database w...
jquery 1.11.4 Manipulate the DOM using CSS selectors
meteor-base 1.0.1 Packages that every Meteor app needs
mobile-experience 1.0.1 Packages for a great mobile user experience
mongo 1.1.2 Adaptor for using MongoDB and Minimongo ove...
semantic:ui 2.1.4 Official Semantic UI Integration for Meteor
session 1.1.1 Session variable
standard-minifiers 1.0.1 Standard minifiers used with Meteor apps by...
tracker 1.0.9 Dependency tracker to allow reactive callbacks
urigo:angular2-meteor 0.2.0+ Angular2 and Meteor integration
Now, I know that barbatus:angular2 is used by urigo:angular2-meteor, but I'm unsure why it would conflict with templating (which is obviously required by something else... if not meteor-base itself.
How do I fix this?
** Edit **
This is my only .html file :
<head>
<title>larpdb</title>
</head>
<body>
<h1>Welcome to Meteor!</h1>
{{> hello}}
</body>
<template name="hello">
<button>Click Me</button>
<p>You've pressed the button {{counter}} times.</p>
</template>
Basically, this is a brand new empty project; how can I avoid getting this error? Do I have to strictly not use <template> tags in my project?
In Meteor 1.2.0.2 you can use
> meteor remove blaze-html-templates
Changes to your project's package version selections:
blaze-html-templates removed from your project
caching-compiler removed from your project
caching-html-compiler removed from your project
templating removed from your project
templating-tools removed from your project
Then add the urigo:angular2-meteor package (must download from GitHub)
> meteor add urigo:angular2-meteor
In meteor .html file have templates only. If you are creating angular templates and giving same extension then at that time it will throw error. because in meteor only master file have html tag and if you adding different html file not having template tag then it will treat it as HTML file and add html tag in it while building.
so if you are creating templates for angular just rename it somefile.ng.html.
so that while meteor build it will don't have conflict.
meteor remove blaze-html-templates
meteor remove ecmascript
Run the following commands to remove meteor's default ecmascript package .
Now the app should run fine .
I'm trying to put together an app, that uses both meteor and angular
I see, what appears to be two different base angular packages: one named angular:angular, and another named urigo:angular-meteor
The page for angular:angular says, that that is the actual angularJS repo, in which case, assuming that means that angular:angular is not an isopack) I'm not even sure on how to add that to a meteor app.
Which one of these should I be using to add angular functionality to a meteor app?
Urigo:angular-meteor is the package that you can use for development in meteor + angular. check out this video by uri himself explaining thoroughly about the package and development using it also.
Are there any conflicts between Angular UI-Bootstrap and Twitter Bootstrap?
I am trying to avoid using jQuery-UI with AngularJS if a more Angular-friendly UI package is available. I already started with Twitter Bootstrap, so I do not wish to unload Twitter Bootstrap.
No, there are no conflicts. Especially since ui-bootstrap is dependent on Twitter Bootstrap.
From the linked docs:
This repository contains a set of native AngularJS directives based on Bootstrap's markup and CSS. As a result no dependency on jQuery or Bootstrap's JavaScript is required. The only required dependencies are:
AngularJS (requires AngularJS 1.3.x, tested with 1.3.13). 0.12.0 is the last version of this library that supports AngularJS 1.2.x.
Bootstrap CSS (tested with version 3.1.1). This version of the library (0.13.0) works only with Bootstrap CSS in version 3.x. 0.8.0 is the last version of this library that supports Bootstrap CSS in version 2.3.x.
If you are going all in on Angular then stick with either AngularStrap or Angular UI Bootstrap, do not mix it with Twitter Bootstrap JS library. Both of the Angular projects mentioned utilize the Bootstrap CSS, but they completely replace the Bootstrap JS library, with pretty much all functionality included.
Apart from the unnecessary bloat to load both libraries, you'll end up with issues integrating the Bootstrap JS library with Angular for stuff like model binding.
I am using gulp-angular for the first time, and am following this blog: http://www.angularonrails.com/how-to-wire-up-ruby-on-rails-and-angularjs-as-a-single-page-application-gulp-version/
When I run through the install questions, it just bombs out, on Karma.
I'm on ubuntu 14 in a Vagrant box, node v0.10.37, npm 2.7.5
Any pointers would be greatly appreciated.
fluent#vagrant-ubuntu-trusty-64:~/fluent/client$ yo gulp-angular myapp
.
.
? Which version of Angular do you want? 1.3.x (latest)
? Which Angular's modules would you want to have? (ngRoute and ngResource will be addressed after) angular-animate.js (enable animation features), angular-cookies.js (handle cookie management), angular-touch.js (for mobile development), angular-sanitize.js (to securely parse and manipulate HTML)
? Would you need jQuery or perhaps Zepto? None (Angular will use its own jqLite)
? Would you like to use a REST resource library? None, $http is enough!
? Would you like to use a router ? ngRoute, the official router
? Which UI framework do you want? Bootstrap, the most popular HTML, CSS, and JS framework
? How do you want to implements your Bootstrap components? Angular UI Bootstrap, Bootstrap components written in pure AngularJS by the AngularUI Team
? Which CSS preprocessor do you want? Sass (Node), Node.js binding to libsass, the C version of the popular stylesheet preprocessor, Sass.
? Which JS preprocessor do you want? None, I like to code in standard JavaScript.
? Which html template engine would you want? None, I like to code in standard HTML.
Template processing error on file karma.conf.js
events.js:72
throw er; // Unhandled 'error' event
^
AssertionError: Trying to copy from a source that does not exist: /usr/lib/node_modules/generator-gulp-angular/app/templates/karma.conf.js
at EditionInterface.exports._copySingle (/usr/lib/node_modules/generator- gulp-angular/node_modules/yeoman-generator/node_modules/mem-fs- editor/actions/copy.js:44:3)
Some additional information, not really sure what to make of this, there is a _karma.conf.js file
myapp#vagrant-ubuntu-trusty-64:/usr/lib/node_modules/generator-gulp-angular/app/templates$ ls
_bower.json e2e gulp _.jshintrc _package.json src tslint.json
coffeelint.json _.gitignore _gulpfile.js _karma.conf.js protractor.conf.js _tsd.json
EDIT
I have had to use sudo for all npm commands. Is this normal?
EDIT 2
https://github.com/Swiip/generator-gulp-angular/issues/470
As per the github issue, deleting the reference to karma.conf.js from app/files.json did the job.
I guess there will be an official fix at some point.