I would like to try Meteor + Vue.
Could share your experience, which the best Vue UI Framework?
-> Stable -> Complete Component!!!
Imho http://element.eleme.io/#/en-US is the best I used.
By the way I’ve never tried it with Vue in Meteor although I think that should work either.
2 Likes
Thanks for your reply, now I am trying Element, iView and Vuetify.
What do you think?
1 Like
Yes iView like Antd and Element.
1 Like
If I am given a choice, iViewUI it is. I have several personal projects lined up already for iViewUI right now. Can’t wait to use it with our ever sweet vue-meteor from @akryum https://github.com/Akryum/vue-meteor
1 Like
MintUI might also be worth trying although I’ve found Elem to be the most complete, yet easy to use. It is also very well documented.
Didn’t know about iView so far. It looks worth trying.
My choice is Element vs iView.
And now I trying Element, bc iView don’t complete for EN document.
1 Like
and
The article is pretty fresh and well done, like all content on Alligator. From valid choices it only misses Buefy which showed up recently and with which I’m playing at the moment.
1 Like
Compare Element VS iView???
Now I tried iView, but have problem with add import enLocale from 'iview/src/locale/lang/en-US';
import {Meteor} from 'meteor/meteor';
import Vue from 'vue';
import VueRouter from 'vue-router';
import VueMeteorTracker from 'vue-meteor-tracker';
import 'iview/dist/styles/iview.css';
import iView from 'iview/dist/iview.min.js';
import local from 'iview/src/locale/lang/en-US';
import 'jquery-validation';
Vue.use(VueRouter);
Vue.use(VueMeteorTracker);
Vue.use(iView,{local});
// Main app
import AppLayout from '/imports/ui/AppLayout.vue';
import Home from '/imports/ui/Home.vue';
const router = new VueRouter({
routes: [
{path: '/', name: 'home', component: Home},
]
});
Get error
es5-shim.js?hash=adc3c62…:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined
at es5-shim.js?hash=adc3c62…:17
at es5-shim.js?hash=adc3c62…:2789
(anonymous) @ es5-shim.js?hash=adc3c62…:17
(anonymous) @ es5-shim.js?hash=adc3c62…:2789
promise.js?hash=67cbac8…:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined
at promise.js?hash=67cbac8…:17
at promise.js?hash=67cbac8…:582
(anonymous) @ promise.js?hash=67cbac8…:17
(anonymous) @ promise.js?hash=67cbac8…:582
ecmascript-runtime.js?hash=72d6777…:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined
at ecmascript-runtime.js?hash=72d6777…:17
at ecmascript-runtime.js?hash=72d6777…:4630
(anonymous) @ ecmascript-runtime.js?hash=72d6777…:17
(anonymous) @ ecmascript-runtime.js?hash=72d6777…:4630
babel-runtime.js?hash=b0451f1…:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined
at babel-runtime.js?hash=b0451f1…:17
at babel-runtime.js?hash=b0451f1…:160
(anonymous) @ babel-runtime.js?hash=b0451f1…:17
(anonymous) @ babel-runtime.js?hash=b0451f1…:160
random.js?hash=a3be1ee…:18 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined
at random.js?hash=a3be1ee…:18
at random.js?hash=a3be1ee…:368
(anonymous) @ random.js?hash=a3be1ee…:18
(anonymous) @ random.js?hash=a3be1ee…:368
mongo-id.js?hash=345d169…:19 Uncaught TypeError: Cannot read property 'Random' of undefined
at mongo-id.js?hash=345d169…:19
at mongo-id.js?hash=345d169…:142
(anonymous) @ mongo-id.js?hash=345d169…:19
(anonymous) @ mongo-id.js?hash=345d169…:142
geojson-utils.js?hash=b204c7d…:17 Uncaught TypeError: Cannot read property 'meteorInstall' of undefined
at geojson-utils.js?hash=b204c7d…:17
at geojson-utils.js?hash=b204c7d…:439
(anonymous) @ geojson-utils.js?hash=b204c7d…:17
(anonymous) @ geojson-utils.js?hash=b204c7d…:439
minimongo.js?hash=15fb4e0…:23 Uncaught TypeError: Cannot read property 'MongoID' of undefined
at minimongo.js?hash=15fb4e0…:23
at minimongo.
What version of Meteor are you running?
METEOR@1.4.4.1
------
// meteor package
# Meteor packages used by this project, one per line.
# Check this file (and the other files in this directory) into your repository.
#
# 'meteor add' and 'meteor remove' will edit this file for you,
# but you can also edit it by hand.
meteor-base@1.0.4 # Packages every Meteor app needs to have
mobile-experience@1.0.4 # Packages for a great mobile UX
mongo@1.1.16 # The database Meteor supports right now
blaze-html-templates # Compile .html files into Meteor Blaze views
reactive-var@1.0.11 # Reactive variable for tracker
jquery@1.11.10 # Helpful client-side library
tracker@1.1.2 # Meteor's client-side reactive programming library
standard-minifier-css@1.3.4 # CSS minifier run for production mode
standard-minifier-js@2.0.0 # JS minifier run for production mode
es5-shim@4.6.15 # ECMAScript 5 compatibility for older browsers.
ecmascript@0.7.2 # Enable ECMAScript2015+ syntax in app code
shell-server@0.2.3 # Server-side component of the `meteor shell` command
# Core
check
accounts-base
accounts-password
ddp-rate-limiter
session
less
# Community
fourseven:scss
fortawesome:fontawesome
matb33:collection-hooks
aldeed:collection2-core
alanning:roles
mdg:validated-method
didericis:callpromise-mixin
#cultofcoders:redis-oplog
#disable-oplog@1.0.7
akryum:vue-component
------
// npm
{
"name": "meteor-vue2-example",
"private": true,
"scripts": {
"start": "meteor run"
},
"dependencies": {
"babel-runtime": "^6.23.0",
"bcrypt": "^1.0.2",
"iview": "^2.0.0-rc.12",
"jquery-validation": "^1.16.0",
"lodash": "^4.17.4",
"meteor-node-stubs": "^0.2.6",
"moment": "^2.18.1",
"simpl-schema": "^0.2.3",
"vue": "^2.2.6",
"vue-meteor-tracker": "^1.2.1",
"vue-router": "^2.5.0",
"vuex": "^2.3.1",
"vuex-router-sync": "^4.1.2"
},
"devDependencies": {}
}
Shouldn’t it be
`import Vue from ‘vue’;
import iView from ‘iview’;
import locale from ‘iview/src/locale/lang/en-US’;
Vue.use(iView, { locale });`
locale instead of local ?
Also try adding
import VueI18n from 'vue-i18n'; Vue.use(VueI18n);
Still don’t work.
It work fine if I block
// import locale from 'iview/src/locale/lang/en-US';
Have anyone help me with iView
@ric0 Hi! Just started learning Vue.js and got Element up and running now.
As a user of Element, could you share what you find interesting about iView? 
@martineboh Can you say why you prefer iView over Element?
Btw, any tips about form validation in Vue?
I don’t see anything about marking input fields as invalid in Element? Should I just create my own class and add it to them?
I guess you meant sharing what I find interesting about Element, not iView, right?
If that’s the case, after working with Elem I see that the form section is very powerful. Indeed it has you covered in almost every scenario (validation included).
Tables also have many features even though I ended up using this additional plugin: https://github.com/njleonzhang/vue-data-tables
In conclusion Elem was the first UI framework that I felt was complete without me needing to look for additional vue plugins to achieve my goals in terms of UI. That was a good surprise. The project wasn’t much complex, nevertheless I just used Elem and the data table plugin and I was set.
Very clear documentation and very easy to set up and hit the ground running. All examples have their JSFiddle counterpart. Almost no learning curve compared to others. Those are things I always look for when adopting new things.
I hope that helped.
Actually, I was asking about iView. I was wondering why you thought it was worth trying, rather than saying “I’m just gonna stick with Element” 
But thanks for you input on Element! Yeah it looks pretty good. I’ve got it up and running with meteor-vue now.
Aah, i see, I only looked at “Input”, and thought it was strange that there were no options to mark it as invalid. But the validation stuff was under “Form”. 