How to use router-vue.js

Hello,

I’m trying to use the router-vue but I have some problems to dynamically load the right component. Would you have any advice for me, please?

I have something that works without require-vue, I don’t find how to import my vue file into my components routes !

`requirejs.config({ paths: { “Vue”: “./js/libraries/vue”, “vue”: “./js/libraries/require-vuejs”, “VueRouter”: “./js/libraries/vue-router” }, shim: { “Vue”: {“exports”: “Vue”} } });

require([“Vue”, “VueRouter”, ‘vue!./components/test.vue’, ‘vue!./components/HelloWorld.vue’], function(Vue, VueRouter){

const router = new VueRouter({
							routes : [
								{
									path: '/',
									name: 'test',
									component:  { template: '<div>foo</div>', name: 'test'}
								},
								{
									path: '/hello',
									name: 'hello',
									component: { template: '<div>bar</div>', name: 'hello'}
								}
							]
						})

Vue.use(VueRouter);

const app = new Vue({
	router
}).$mount('#app');

});`

Thank you in advance

[Lospepes]

Thanks a lot @edgardleal, it works !

[edgardleal]

In your code you are registering yours components internally using Vue.component('name', object). I recomend you to export your component as plain object like this:

	define(["Vue"], function(Vue) {
		var component = {
			template: template,
			data: function() {
				return {"msg": "Ok"};
			}
		};
               Vue.component("my-component", component);
                return component;
	});

Now you can use with your current code, and with vue-router too.