How to install vuetify with meteor

Hi.

I have been working many monthy using meteor- vue with no major problem.
Some days ago, somehow, vuetify stop working.

I am trying to install it with the new way:

meteor npm install @vue/cli -g
meteor vue add vuetify

But I get this error:

Choose a preset: Default (recommended)

🚀  Invoking generator for vue-cli-plugin-vuetify...
 ERROR  Error: ETXTBSY: text file is busy, open '/home/r2d2/bapp/.meteor/local/dev_bundle/bin/node'
Error: ETXTBSY: text file is busy, open '/home/r2d2/bapp/.meteor/local/dev_bundle/bin/node'
    at Object.fs.openSync (fs.js:646:18)
    at Object.fs.writeFileSync (fs.js:1299:33)
    at Object.keys.forEach (/home/r2d2/.meteor/packages/meteor-tool/.1.8.1.ani1yi.p0f9s++os.linux.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.linux.x86_64/dev_bundle/lib/node_modules/@vue/cli/lib/util/writeFileTree.js:25:8)
    at Array.forEach (<anonymous>)
    at writeFileTree (/home/r2d2/.meteor/packages/meteor-tool/.1.8.1.ani1yi.p0f9s++os.linux.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.linux.x86_64/dev_bundle/lib/node_modules/@vue/cli/lib/util/writeFileTree.js:22:22)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:189:7)

How do I install vuetify wiht meteor?
Thanks.

Am I the only one having this problem?

Any help how to install vue-vuetify with meteor?
Thanks.

I guess that asking how to install meteor with vue must be strange enough that nobody ever does it.

Well, I have no idea how to do it, but

is probably not the right way to do it, because you are using meteor, not @vue/cli for your project.

At least I’m not the only one out there.

1 Like

Hi. Thanks for your answer.

I have dropped Meteor and I am currently adapting the whole project to graphql-apollo. Weeks and weeks lost thanks to this meteor-vuetify issue.

The flexibility of graphql is something I couldn’t even dream about when using meteor.
The downsize is that reactivity is not automatic at all and has to be coded case by case.
I have read that meteor doesn’t scale well due to its global reactivity.

Cheers.

I’ve been using Meteor successfully with Vuetify. You can’t use the CLI though, I think I just did meteor npm install --save vuetify@1.5.18.

When 2.0 was released I did try upgrading, but that didn’t work and I didn’t have time to investigate, so I’ve dropped back to 1.5 until I have time more time.

Since Meteor uses it’s own build system it isn’t possible to get the a-la-carte import working to reduce the initial bundle size. I started a thread on the Meteor forum here. Again, when I have more time I might try switching the Meteor build system over to webpack so I can use vuetify-loader.

Meteor is awesome and well worth the effort to get stuff working with it.

Edit: Just re-read your post - Meteor DOES scale well. Plenty of people are using it for largeish apps. It’s also efficient, I’ve had an app running for years with 1000s of users and always 100s of concurrent connections, all on a single $5 Digital Ocean droplet, including mongo.

Hi wildhart. Thanks for your answer.

I wish I had had that info some weeks ago. Now I am finishing adapting the project to graphql-apollo.
I tried and tried everything I could think of (I tried installing old vuetify releases) but nothing worked.

Anyway I didn’t upgrade anything when it stopped working. I had my computer + 2 virtualboxes and the three of them stopped working at the same time (I mean vuetify).
The feeling was terrible. I didn’t want to risk that happening with the web in production (just imagine to be weeks down).

Thanks.

Just an update, I’ve managed to get Vuetify 2.x working with Meteor. The crucial bit I was missing is mentioned in the comments below.

//// client/main.js
import Vue from 'vue';
import VueMeteorTracker from 'vue-meteor-tracker';
Vue.use(VueMeteorTracker);

import Vuetify from 'vuetify'; 
import 'vuetify/dist/vuetify.min.css';
Vue.use(Vuetify); // this is all you need for Vuetify 1.x

import App from './App.vue';
import router from './router.js';

// for Vuetify 2.x you also need:
const vuetify = new Vuetify({options...});

Meteor.startup(() => {
	new Vue({
		el: '#app',
		router,
		vuetify, // this bit is also needed for Vuetify 2.x
		...App,
	});
});

The fact that I need to have all of Vuetify packages and not only the ones I’m using is kind of a deal breaker. Please let me know if you find any way this can be fixed and still use Meteor. Thanks!

Yeah, it is a real pain. Fortunately the app I’m currently using it for doesn’t need lightweight landing pages so I’m not too concerned about bundle size and so I haven’t tried converting to webpack yet.

Meteor has a cool bundle-visualizer package. Using that I can tell you that the production bundle includes 636 MB for vuetify@1 and 1MB for vuetify@2:

what does option… in “const vuetify = new Vuetify({options…});” do?

The options object is where you define icons, theme (light/dark), rtl, i18n, and define your own breakpoints.