Laravel + Vue.js application routing not working properly
Laravel + Vue.js application routing not working properly.
when i run laravel + vuejs application "http://127.0.0.1:8000/user" everything is working fine but when i run my application on xampp server using this url "http://localhost/Ecommerce/" then vue-router not working.
For example when i click on my navigation link "users" then it will redirect to
"http://localhost/user" instead of "http://localhost/Ecommerce/user" .
Please help.
laravel vue.js
asked Nov 13 at 14:42
sunil patidar
755
add a comment |
Laravel + Vue.js application routing not working properly.
when i run laravel + vuejs application "http://127.0.0.1:8000/user" everything is working fine but when i run my application on xampp server using this url "http://localhost/Ecommerce/" then vue-router not working.
For example when i click on my navigation link "users" then it will redirect to
"http://localhost/user" instead of "http://localhost/Ecommerce/user" .
Please help.
laravel vue.js
asked Nov 13 at 14:42
sunil patidar
755
Please show us what your routes in both Laravel and vue-router are.
– Delena Malan
Nov 13 at 14:43
web.php Route::get('/', function () { return view('welcome'); }); Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); Route::get('{path}',"HomeController@index")->where( 'path', '([A-zd-/_.]+)?' );
– sunil patidar
Nov 13 at 14:49
and app.js is require('./bootstrap'); window.Vue = require('vue'); import VueRouter from 'vue-router' Vue.use(VueRouter) const routes = [ { path: '/dashboard', component:require('./components/Dashboard.vue') }, { path: '/user', component: require('./components/User.vue') } ] Vue.component('example-component', require('./components/ExampleComponent.vue')); const router = new VueRouter({ mode: 'history', routes // short forroutes: routes}) const app = new Vue({ el: '#app', router });
– sunil patidar
Nov 13 at 14:50
thanks for reply @Delena Malan
– sunil patidar
Nov 13 at 14:52
if i am using Ip address instead of domain name its working fine.
– sunil patidar
Nov 13 at 14:58
add a comment |
Laravel + Vue.js application routing not working properly.
when i run laravel + vuejs application "http://127.0.0.1:8000/user" everything is working fine but when i run my application on xampp server using this url "http://localhost/Ecommerce/" then vue-router not working.
For example when i click on my navigation link "users" then it will redirect to
"http://localhost/user" instead of "http://localhost/Ecommerce/user" .
Please help.
laravel vue.js
asked Nov 13 at 14:42
sunil patidar
755
Laravel + Vue.js application routing not working properly.
when i run laravel + vuejs application "http://127.0.0.1:8000/user" everything is working fine but when i run my application on xampp server using this url "http://localhost/Ecommerce/" then vue-router not working.
For example when i click on my navigation link "users" then it will redirect to
"http://localhost/user" instead of "http://localhost/Ecommerce/user" .
Please help.
laravel vue.js
laravel vue.js
asked Nov 13 at 14:42
sunil patidar
755
asked Nov 13 at 14:42
sunil patidar
755
edited Nov 13 at 14:59
asked Nov 13 at 14:42
sunil patidar
755
asked Nov 13 at 14:42
sunil patidar
755
asked Nov 13 at 14:42
sunil patidar
755
755
Please show us what your routes in both Laravel and vue-router are.
– Delena Malan
Nov 13 at 14:43
web.php Route::get('/', function () { return view('welcome'); }); Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); Route::get('{path}',"HomeController@index")->where( 'path', '([A-zd-/_.]+)?' );
– sunil patidar
Nov 13 at 14:49
and app.js is require('./bootstrap'); window.Vue = require('vue'); import VueRouter from 'vue-router' Vue.use(VueRouter) const routes = [ { path: '/dashboard', component:require('./components/Dashboard.vue') }, { path: '/user', component: require('./components/User.vue') } ] Vue.component('example-component', require('./components/ExampleComponent.vue')); const router = new VueRouter({ mode: 'history', routes // short forroutes: routes}) const app = new Vue({ el: '#app', router });
– sunil patidar
Nov 13 at 14:50
thanks for reply @Delena Malan
– sunil patidar
Nov 13 at 14:52
if i am using Ip address instead of domain name its working fine.
– sunil patidar
Nov 13 at 14:58
add a comment |
Please show us what your routes in both Laravel and vue-router are.
– Delena Malan
Nov 13 at 14:43
web.php Route::get('/', function () { return view('welcome'); }); Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); Route::get('{path}',"HomeController@index")->where( 'path', '([A-zd-/_.]+)?' );
– sunil patidar
Nov 13 at 14:49
and app.js is require('./bootstrap'); window.Vue = require('vue'); import VueRouter from 'vue-router' Vue.use(VueRouter) const routes = [ { path: '/dashboard', component:require('./components/Dashboard.vue') }, { path: '/user', component: require('./components/User.vue') } ] Vue.component('example-component', require('./components/ExampleComponent.vue')); const router = new VueRouter({ mode: 'history', routes // short forroutes: routes}) const app = new Vue({ el: '#app', router });
– sunil patidar
Nov 13 at 14:50
thanks for reply @Delena Malan
– sunil patidar
Nov 13 at 14:52
if i am using Ip address instead of domain name its working fine.
– sunil patidar
Nov 13 at 14:58
Please show us what your routes in both Laravel and vue-router are.
– Delena Malan
Nov 13 at 14:43
Please show us what your routes in both Laravel and vue-router are.
– Delena Malan
Nov 13 at 14:43
web.php Route::get('/', function () { return view('welcome'); }); Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); Route::get('{path}',"HomeController@index")->where( 'path', '([A-zd-/_.]+)?' );
– sunil patidar
Nov 13 at 14:49
web.php Route::get('/', function () { return view('welcome'); }); Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); Route::get('{path}',"HomeController@index")->where( 'path', '([A-zd-/_.]+)?' );
– sunil patidar
Nov 13 at 14:49
and app.js is require('./bootstrap'); window.Vue = require('vue'); import VueRouter from 'vue-router' Vue.use(VueRouter) const routes = [ { path: '/dashboard', component:require('./components/Dashboard.vue') }, { path: '/user', component: require('./components/User.vue') } ] Vue.component('example-component', require('./components/ExampleComponent.vue')); const router = new VueRouter({ mode: 'history', routes // short for
routes: routes }) const app = new Vue({ el: '#app', router });– sunil patidar
Nov 13 at 14:50
and app.js is require('./bootstrap'); window.Vue = require('vue'); import VueRouter from 'vue-router' Vue.use(VueRouter) const routes = [ { path: '/dashboard', component:require('./components/Dashboard.vue') }, { path: '/user', component: require('./components/User.vue') } ] Vue.component('example-component', require('./components/ExampleComponent.vue')); const router = new VueRouter({ mode: 'history', routes // short for
routes: routes }) const app = new Vue({ el: '#app', router });– sunil patidar
Nov 13 at 14:50
thanks for reply @Delena Malan
– sunil patidar
Nov 13 at 14:52
thanks for reply @Delena Malan
– sunil patidar
Nov 13 at 14:52
if i am using Ip address instead of domain name its working fine.
– sunil patidar
Nov 13 at 14:58
if i am using Ip address instead of domain name its working fine.
– sunil patidar
Nov 13 at 14:58
add a comment |
1 Answer
1
active
oldest
votes
Try adding a base url when you create you VueRouter, e.g.
new VueRouter({
base: '/Ecommerce/',
routes: [...],
});
answered Nov 13 at 15:15
Delena Malan
607315
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53283471%2flaravel-vue-js-application-routing-not-working-properly%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
Try adding a base url when you create you VueRouter, e.g.
new VueRouter({
base: '/Ecommerce/',
routes: [...],
});
answered Nov 13 at 15:15
Delena Malan
607315
add a comment |
Try adding a base url when you create you VueRouter, e.g.
new VueRouter({
base: '/Ecommerce/',
routes: [...],
});
answered Nov 13 at 15:15
Delena Malan
607315
add a comment |
Try adding a base url when you create you VueRouter, e.g.
new VueRouter({
base: '/Ecommerce/',
routes: [...],
});
answered Nov 13 at 15:15
Delena Malan
607315
Try adding a base url when you create you VueRouter, e.g.
new VueRouter({
base: '/Ecommerce/',
routes: [...],
});
answered Nov 13 at 15:15
Delena Malan
607315
answered Nov 13 at 15:15
Delena Malan
607315
answered Nov 13 at 15:15
Delena Malan
607315
answered Nov 13 at 15:15
Delena Malan
607315
607315
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53283471%2flaravel-vue-js-application-routing-not-working-properly%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Please show us what your routes in both Laravel and vue-router are.
– Delena Malan
Nov 13 at 14:43
web.php Route::get('/', function () { return view('welcome'); }); Auth::routes(); Route::get('/home', 'HomeController@index')->name('home'); Route::get('{path}',"HomeController@index")->where( 'path', '([A-zd-/_.]+)?' );
– sunil patidar
Nov 13 at 14:49
and app.js is require('./bootstrap'); window.Vue = require('vue'); import VueRouter from 'vue-router' Vue.use(VueRouter) const routes = [ { path: '/dashboard', component:require('./components/Dashboard.vue') }, { path: '/user', component: require('./components/User.vue') } ] Vue.component('example-component', require('./components/ExampleComponent.vue')); const router = new VueRouter({ mode: 'history', routes // short for
routes: routes}) const app = new Vue({ el: '#app', router });– sunil patidar
Nov 13 at 14:50
thanks for reply @Delena Malan
– sunil patidar
Nov 13 at 14:52
if i am using Ip address instead of domain name its working fine.
– sunil patidar
Nov 13 at 14:58