That’s funny you suggest that, I just paid for this learning course the other day after I noticed how well he explained Vue concepts!
I haven’t gotten to Vuex yet, but will report back here after I’m done 
1 Like
Hi everyone, I need help… been pulling my hair out with an error I’m getting… I’ve setup Meteor + Vue + Vuex + VueRouter…
The Meteor build goes fine, but loading in the browser I keep getting this error:
Uncaught Error: Cannot find module ‘babel-runtime/helpers/extends’
The thing is, everything was working fine until I couldn’t take the Meteor build times anymore and started
playing around with file locations and removing packages to try and get client file to reload faster…
I’m probably missing something trivial, but I’ve been at it for 2 days! If anyone can help me debug this
issue I’ll totally appreciate it… thank u
(yeah, body is too similar to something that i’ve posted and deleted)
Fine, but… there’s nothing to debug. What’s your package list, what versions, what’s your configuration?
Also, why do you want to make client file to reload faster, does hot module reload not work for you by default?
There are two separate issues here. First is the error message, second are the slow build times on the client.
For the first one, start with deleting the whole node_modules folder and do meteor npm install again.
For the second one, the reason may be mixing Vue and Blaze templates in the same project, as I assume hot module reload will only work for Vue templates. Are Blaze templates absolutely necessary for your project?
@gusto You’re right, two issues. I’d love to know how you’re getting HMR and fix the build times but of course first I need to get the project working again… I left in the Blaze templates just for the easy drop-in of the accounts package, if that’s the stopper for hot reloads I can remove it and make the login forms with Vue.
Regarding the error message, I’ve tried deleteing and installing node_modules… I’ve tried creating a completely new meteor project from scratch, reinstalling all npm/meteor packages and copying the needed files over… still same error, tried switching around file locations, my guess was the error had something to do with how .vue files are resolved, because for example module.resolve of account related files and others load up babel-runtime/helpers/*.js (many files in that location) with no problem…
thx for the help.
I’m not 100% sure to be honest. Thinking of it, imho that would be a stopper, but I never mixed Vue with Blaze so I can’t guarantee it. Hot module reload works out of the box with new Vue+Meteor project. Whenever I save the changes in the client files, I instantly see the updates in the browser, even with a bigger project.
What version of meteor is that? 1.4.2.3?
While I can’t help more, I hope you resolve that.
It works with just akryum:vue and akryum:vue-component. It also works with your configuration, with vue-meteor-tracker from npm instead of akryum:vue, I checked it.
Yes, I’m using Vuex and Vue-router from npm and it works without any issues.
It will be difficult to use Blaze and Vue in the same project. Specially if you use nested route or parameters on the route. It’s recommended to use vue-router, and this router will have issues with Blaze in this way.
It’s best to start green field with meteor + vue and you can get started by using this install instructions: Basics: Setting up a Meteor + VueJS project. If you have to mix, you should wait for this initiative to take off: Vue as the base of Blaze 2.0.
I have a sister application that is all Blaze and uses Accounts. This new system will be only Meteor + VueJS. They’ll both use the same MongoDB. I’ll need to tie the VueJS system into the Accounts system, which will require custom calls to Accounts, and of course we’ll need to add custom forms for login.
In another VueJS thread there is a reference to using Accounts with VueJS I think (can’t find the link ATM). But we should collaborate on this effort to help one another and others that come behind us – we’re trail “blazing” here. Once I get to it, I’ll post a repo of what I’m working on in this area if there’s not already something out there.
I don’t think it conflicts with the HMR system.
Please could you post the full error trace? And maybe if you could publish your code on GitHub or somewhere else for us to check (if possible)?
Hi akryum, I’ve tried to start with a clean project to reproduce the initial error I was getting,
but now I fell even deeper into the erroRabbit hole… getting a strange issue with rendering
.vue components, where the style tags are exported instead of the template??
I created a simple gitrep, hopefully you can see the issue also:
thanks for your help.
I don’t get any <style> related error. I do get errors in App because of you using multiple root elements in the template and some router related error, but nothing about CSS.
What’s more, the CSS is working properly, the background has the color it should.
Sorry, I fixed the App file, but I’m still getting the style errors… I put a screenshot of the console.logs I’m getting in the readme
1 Like
I don’t have any error except the one related to <router-view> because you didn’t include vue-router.
I cloned your repo, then:
meteor npm install
meteor update
meteor update --all-packages
meteor
So weird, I updated the repo, not using router, just loading App.vue, still getting the same style tag bug, I tried reinstalling meteor, also didn’t help…
I see in your screenshot how your logs are coming out fine, I don’t understand what’s different about my environment… Are you also on windows?
(thx for your time)
I’m on Windows 10 using Meteor 1.4.2.3.
same here… ahhh i’m going crazy, doesn’t make sense… what could possibly make the vue modules export just the style tag?
What is the result of meteor npm list and meteor list?
hmm now that i’m looking at it, i was sure i switched blaze-html-template to static-html, I’ll try doing that now
@webkit, it seems you’re on the step BEFORE getting components working and building them – you’re just trying to set the project up right.
There’s another thread about getting your project set up here: Basics: Setting up a Meteor + VueJS project, it might help you to have the correct packages in your project to start.
I have the exact same versions with no error.