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 .
Related
On the telerik site, I found the page
https://docs.telerik.com/kendo-ui/intro/installation/cdn-service#accessing-the-cdn
which mentions the CDN url
http://kendo.cdn.telerik.com/2018.2.620/js/kendo.all.min.js
However, that file doesn't have the definitions for the React components Grid and GridCell.
This even though these definitions are in the NPM package #progress/kendo-react-grid.
Is there some other CDN url that gives me the .js file for Kendo UI for React?
Alternatively, if that file is not available from a CDN, is there a single file with all Kendo UI for React code that I can serve from my own server?
I have to load Kendo UI for React using a separate script tag. I can't use webpack or browserify to pack node modules.
The kendo.all.min.js is the jquery suite.
The kendo react grid is here:
https://unpkg.com/#progress/kendo-react-grid#1.3.0/dist/cdn/js/kendo-react-grid.js
It is per-package, and there is no something like all.js at-least at this point in time.
The best public CDN is jsDelivr: https://www.jsdelivr.com/
It can serve up files and bundles directly for any NPM package, Github repo, or Wordpress plugin. You can even combine several files together into a single download.
Here's the package for Kendo UI React Grid: https://www.jsdelivr.com/package/npm/#progress/kendo-react-grid
Download the file you need there or add it to the "selected files" on the right to build your own custom script bundle.
I have been an Angular1 developer and recently considering using Angular4 for a new web application project.
With Angular1, I used to purchase an 'Bootstrap Admin Theme' which came with well done and consistent CSS and a lot of JS plugins put together which allowed me to focus on the application itself. I used to insert Angular1 code into it in the areas where there was data manipulation and I enjoyed doing that. So I had the best of both worlds.
Is there any way, this could be achieved in Angular2/Angular4, 1) without really missing out the JS plugins the Theme offers and 2) without having to copy the CSS everywhere ?
Yes it is possible but you will have to do 'some' tweaking.
Template
First of all import all your js plug-ins through npm
npm install (plug in) --save
Then you will have to edit your angular-cli.json to include js plug-ins (js & css)
"styles": ["styles.css"],
"scripts": [],
Put the path to styles & scripts in to array
Then you should add main template css file in to predefined styles.css
Next you should break up your pages in to components (view components and 'tag' components).
Now about custom app dev:
Add your custom
- js in to *.component.js
- css in to *.component.css
- html in to *.component.html
(* stands for component name)
et voila...
I need the Sticky States feature for my project.
I'm using UI Router 1.0.0-rc.1 so i can't use the ui-router-extras library (that was designed for 0.xxx)
Recently the author ported that feature for the 1.xx router
https://github.com/ui-router/sticky-states
This release comes only with .ts sources.
My project is written in plain ES5 js, so i tried to build myself the final js to be used in browser with <script src="..." type="text/javascript">
I have npm install all dependancies and then npm run build
What i got are two folders 'lib' and 'lib-esm' that contains each more than one js files that i don't understand how to reference them from .html file (files are index.js & stickyStates.js)
Also tried to run webpack but what i get is a huge file with more than 8K lines of code (probabile also ui-router get bundled within..)
NOTE: Author has already been asked for that by someone but he didn't provided a solution yet:
https://github.com/ui-router/sticky-states/issues/4
Thank you very much
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"
I'm reading https://github.com/ExactTarget/fuelux in order to get familiar with the Fuelux wizard, and how I can integrate it with my AngularJS project.
In the non-AMD section it says :
Non-AMD
If you'd prefer not to use AMD, simply add the loader script to the head tag of your page:
<script src="http://www.fuelcdn.com/fuelux/2.6.1/loader.min.js" type="text/javascript"> </script>
but something in jquery is conflicting with my angular routes.
I'm also using this as a guide, and adding the necessary css links and requirejs links; however the wizard does not render properly (as if it were missing the css styling).
wizard
UPDATE:
In my latest attempt, after downloading from https://github.com/ExactTarget/fuelux/tree/3.0.0-wip , I'm still getting the non-formatted wizard. Please see screen shot :
FuelUX 2.x is AMD only. The loader.js is a polyfill of sorts (almond.js- a minimal AMD API implementation) that allows AMD, just so you don't have to load require.js yourself, but it's still there.
The latest version FuelUX 3 is a WIP branch and is UMD (Universal Module Definition) which means it can be used with/without AMD via tags with only Bootstrap and JQuery as dependencies. You might try it.