cretueusebiu / laravel-vue-spa Goto Github PK
View Code? Open in Web Editor NEWA Laravel-Vue SPA starter kit.
Home Page: https://laravel-vue-spa.cretueusebiu.com
License: MIT License
laravel-vue-spa's People
Contributors
![dependabot[bot] avatar](https://avatars.githubusercontent.com/in/29110?v=4 "dependabot[bot]")
Stargazers
Watchers
Forkers
srdjanmitrovic qqjameqq1 chrislandeza phpjunior bitnumbers nitikarn5990 0xuhe renztoygwapo jpriceonline mannysoft puckwang alexanderawitin luckys vue-mk ethanhuang0526 amamarul ilabutk liujingyu fwarren anjjriit aphofstede nqtrieudev quiss aquicreamos thewebarea croman83 sotharith andrewdblessed tum845 gabomasi jonothedev maizergomes dvien gpanos redaced aunzo nuovecode orumad rendebul sqtweb-solutions ayrokid ricardoii treetopdevs asterism612 alejmendez87 ecuation pattern88 tomasnido jeffryjdelarosa martinyounghoonkim webfsd cesaramirez yang3259 johanholm sudip2222 mehadihasan afoysal emdadul-huq folkevil binbinmax sornss everan-1994 cambricorp colombinis s207152 fer-ri nrthbound yogi-indragiri hogle-vue gampa369 wicool ahmadnurfadilah albertcht mixfile bacubin zhaomengqiao thekudryash erik-ropez fariswidhi rafardomingos bankgb009 aviouy zaenal youchenlee nadge ogaboss hassanjamal tsparksh rongmic wa05 riszkhy steffen1249 pspsygroup guoyu07 chenglhzxl hiskio cherub0526 juicee-io kerwin-cn rowjatlaravel-vue-spa's Issues
npm run production console error
Uncaught Error: Bootstrap's JavaScript requires jQuery. jQuery must be included before Bootstrap's JavaScript.
deploy
Hi @cretueusebiu !
I appreciate your work, but I´m a question about deploy. Have I publish in web server everything in laravel-vue-spa folder ?
Ask about Kernel
Hi, could you explain me, why deleted most web classes from Kernel? And, how you implement CSRF protection in app?
Socialite integration
Hello! How do you integrate Laravel socialite with this?
Handling permissions
I'll add support for permissions and was wondering if there's a way to include this in your repo. If we could find an approach that's fine for both of us I'd try to work on a PR.
My idea is to include laratrust and put the complete list of permission keys available to the user in auth/user. I'd then assign 0-n permission keys to each route to only show the ones available to the user.
In a further version we could even add a simple backend so that one could manage users and roles without writing any code.
What are your thoughts on that?
Sub Domain Session Sharing in refference to this #44
I Have project i would like to share session between,
The project is using one laravel app, which means it is using the same app key so i am using laravel route group for routing the sub domain. like this
`Route::group(['domain' => 'example.test'], function () {
Route::get('{path}', function () {
return view('index');
})->where('path', '(.*)');
});
Route::group(['domain' => 'dashboard.example.test'], function () {
Route::get('{path}', function () {
return view('dashboard.index');
})->where('path', '(.*)');
});`
Notice i am using different view for the two domains.
And in my laravel resource folder i have for the main domain which is using the assets and another folder for the sub domain which is using the dashboard with the duplicate of whats in the assets folder and some little changes in the file to watch for the files in the directory alone thanks to laravel mix for that, in short i different views for each domain, but when login on the main domain or the sub domain, the cookie is suppose to be shared but not sharing, think i can get a little help
cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
after migrating database then installed yarn the i've run this command
npm run production
`> @ production E:\wamp64\www\mostadev\crud\1
cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
'cross-env' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1`
[HELP] multi router guard
I can not make router with 2 guard user and admin in the same routes.js
it always return to the default guard from router/index.js
What I need to do:
- I have directory like so:
-- aaaa/bbbb/cccc => stand for admin page
-- aaaa/dddd/eeee => stand for user page - When I access aaaa/dddd/eeee without login, it always check auth from aaaa/bbbb/cccc
- I had tried to separate router and user_router but it said $nextTick was null.
This is just a half of my project, it requires 4 types of users to login using different path. - Path 1: aaaa/bbbb/cccc => auth user type 1
- Path 2: aaaa/dddd/eeee => auth user type 2
- Path 3: ffff/bbbb/cccc => auth user type 3
- Path 4: ffff/dddd/eeee => auth user type 4
Could you please help me a guide to make this type of router?
help
Can you make a video tutorial explaining? Thank you
Route links for the same 'layout' is not moving to top (scroll)
This is your scrollBehaviour of router:
function scrollBehavior (to, from, savedPosition) {
if (savedPosition) {
return savedPosition
}
const position = {}
if (to.hash) {
position.selector = to.hash
}
if (to.matched.some(m => m.meta.scrollToTop)) {
position.x = 0
position.y = 0
}
return position
}I'm having 2 issues:
1️⃣ If I move from page A to page B, using the same layout (app), the scroll keeps in same position when I click links. This is noticeable in large pages.
If I use a different layout for B, then it works as expected. How can I move to top for navigation? The savedPosition should be for Browser back, doesn't?
2️⃣ Links to hash do not works neither (I mean, scroll to a section). Again, only works if I use different layourts.
Making simple inspects, if (to.hash) enters, but is not applied if we are in the same layout.
Also, browser back/forward do not scrolls to the hash.
The layouts implementation of this boilerplate is great! 🎉 But I'm running into this issues (I'm not expert in Vue). 😞
the-control-group/voyager Integration
Hi. I want to use Voyager as admin panel but have a lot of issues after installation. How can I do this?
https://github.com/the-control-group/voyager
Route [password.reset] not defined.
https://github.com/cretueusebiu/laravel-vue-spa/blob/master/routes/api.php#L29
try adding ->name('password.reset');
Also, the reset link from the email returns Page Not Found.
Suitable for production?
I read this is a work in progress. May you provide a to-do list in order to help or to know how much is required for using this template in a production environment? I would like to help, for sure. Let me know.
misstype?
resources/assets/js/components/index.js
import Icon from './Icon.vue'
but filename is in lowercase icon.vue
Feature Request: PWA
Thank you for the awesome repo, I have been working hard to make this setup for 2 days now, dunno why the idea of searching for a ready setup did not come to mind. Really Thank you 😄
I think adding PWA would make it more awesome, even if as an option.
Upgrade to Laravel5.5
Could you upgrade your template to Laravel5.5?
Auth guard driver [api] is not defined.
Hi,
When I try to register/login, i get the following error:
"VM1884:1 POST http://localhost:8000/api/register 500 (Internal Server Error)"
This is the response:
{
"message": "Auth guard driver [api] is not defined.",
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Auth\\AuthManager.php",
"line": 99,
"trace": [
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Auth\\AuthManager.php",
"line": 70,
"function": "resolve",
"class": "Illuminate\\Auth\\AuthManager",
"type": "->",
"args": [
"api"
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Auth\\AuthManager.php",
"line": 54,
"function": "guard",
"class": "Illuminate\\Auth\\AuthManager",
"type": "->",
"args": [
"api"
]
},
{
"function": "Illuminate\\Auth\\{closure}",
"class": "Illuminate\\Auth\\AuthManager",
"type": "->",
"args": [
null
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Auth\\AuthServiceProvider.php",
"line": 86,
"function": "call_user_func",
"args": [
{},
null
]
},
{
"function": "Illuminate\\Auth\\{closure}",
"class": "Illuminate\\Auth\\AuthServiceProvider",
"type": "->",
"args": [
null
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Http\\Request.php",
"line": 439,
"function": "call_user_func",
"args": [
{},
null
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Middleware\\ThrottleRequests.php",
"line": 90,
"function": "user",
"class": "Illuminate\\Http\\Request",
"type": "->",
"args": []
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Middleware\\ThrottleRequests.php",
"line": 47,
"function": "resolveRequestSignature",
"class": "Illuminate\\Routing\\Middleware\\ThrottleRequests",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
"line": 149,
"function": "handle",
"class": "Illuminate\\Routing\\Middleware\\ThrottleRequests",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
},
{},
"60",
"1"
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php",
"line": 53,
"function": "Illuminate\\Pipeline\\{closure}",
"class": "Illuminate\\Pipeline\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
"line": 102,
"function": "Illuminate\\Routing\\{closure}",
"class": "Illuminate\\Routing\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php",
"line": 612,
"function": "then",
"class": "Illuminate\\Pipeline\\Pipeline",
"type": "->",
"args": [
{}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php",
"line": 571,
"function": "runRouteWithinStack",
"class": "Illuminate\\Routing\\Router",
"type": "->",
"args": [
{
"uri": "api/login",
"methods": [
"POST"
],
"action": {
"middleware": [
"api",
"guest:api"
],
"uses": "App\\Http\\Controllers\\Auth\\LoginController@login",
"controller": "App\\Http\\Controllers\\Auth\\LoginController@login",
"namespace": "App\\Http\\Controllers",
"prefix": "api",
"where": []
},
"controller": {},
"defaults": [],
"wheres": [],
"parameters": [],
"parameterNames": [],
"computedMiddleware": [
"api",
"guest:api",
"guest"
],
"compiled": {}
},
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Router.php",
"line": 549,
"function": "dispatchToRoute",
"class": "Illuminate\\Routing\\Router",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php",
"line": 176,
"function": "dispatch",
"class": "Illuminate\\Routing\\Router",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php",
"line": 30,
"function": "Illuminate\\Foundation\\Http\\{closure}",
"class": "Illuminate\\Foundation\\Http\\Kernel",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\fideloper\\proxy\\src\\TrustProxies.php",
"line": 56,
"function": "Illuminate\\Routing\\{closure}",
"class": "Illuminate\\Routing\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
"line": 149,
"function": "handle",
"class": "Fideloper\\Proxy\\TrustProxies",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
},
{}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php",
"line": 53,
"function": "Illuminate\\Pipeline\\{closure}",
"class": "Illuminate\\Pipeline\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest.php",
"line": 30,
"function": "Illuminate\\Routing\\{closure}",
"class": "Illuminate\\Routing\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
"line": 149,
"function": "handle",
"class": "Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
},
{}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php",
"line": 53,
"function": "Illuminate\\Pipeline\\{closure}",
"class": "Illuminate\\Pipeline\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest.php",
"line": 30,
"function": "Illuminate\\Routing\\{closure}",
"class": "Illuminate\\Routing\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
"line": 149,
"function": "handle",
"class": "Illuminate\\Foundation\\Http\\Middleware\\TransformsRequest",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
},
{}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php",
"line": 53,
"function": "Illuminate\\Pipeline\\{closure}",
"class": "Illuminate\\Pipeline\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\ValidatePostSize.php",
"line": 27,
"function": "Illuminate\\Routing\\{closure}",
"class": "Illuminate\\Routing\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
"line": 149,
"function": "handle",
"class": "Illuminate\\Foundation\\Http\\Middleware\\ValidatePostSize",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
},
{}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php",
"line": 53,
"function": "Illuminate\\Pipeline\\{closure}",
"class": "Illuminate\\Pipeline\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Middleware\\CheckForMaintenanceMode.php",
"line": 46,
"function": "Illuminate\\Routing\\{closure}",
"class": "Illuminate\\Routing\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
"line": 149,
"function": "handle",
"class": "Illuminate\\Foundation\\Http\\Middleware\\CheckForMaintenanceMode",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
},
{}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Routing\\Pipeline.php",
"line": 53,
"function": "Illuminate\\Pipeline\\{closure}",
"class": "Illuminate\\Pipeline\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Pipeline\\Pipeline.php",
"line": 102,
"function": "Illuminate\\Routing\\{closure}",
"class": "Illuminate\\Routing\\Pipeline",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php",
"line": 151,
"function": "then",
"class": "Illuminate\\Pipeline\\Pipeline",
"type": "->",
"args": [
{}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\vendor\\laravel\\framework\\src\\Illuminate\\Foundation\\Http\\Kernel.php",
"line": 116,
"function": "sendRequestThroughRouter",
"class": "Illuminate\\Foundation\\Http\\Kernel",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\public\\index.php",
"line": 55,
"function": "handle",
"class": "Illuminate\\Foundation\\Http\\Kernel",
"type": "->",
"args": [
{
"attributes": {},
"request": {},
"query": {},
"server": {},
"files": {},
"cookies": {},
"headers": {}
}
]
},
{
"file": "C:\\Users\\Gebruiker\\Desktop\\vuepaste\\server.php",
"line": 21,
"args": [
"C:\\Users\\Gebruiker\\Desktop\\vuepaste\\public\\index.php"
],
"function": "require_once"
}
]
}
Vue SSR
Hi,
Can we setup the vue SSR with this template? i'm a little bit confused...
Changing locale from Vue
I wrote a middleware for api request which takes Content-Language header value and changes locale for Laravel. How can I change the locale from Vue code?
help me
$ yarn / npm install
yarn run v1.3.2
error Command "C:/Program Files/Git/" not found.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
controller not return any data
I'm created another table to store articles and this is my controller. this not returns any data from database please help me.
class ArticleController extends Controller
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
return Article::orderBy('id', 'DESC')->get();
}
this my route : Route::resource('/article', 'ArticleController');
Refresh token
Refresh token to expire in 1 hour. Only expire when the user does not interact with the page
thanks
updatePassword saves plain text instead of bcrypt
[suggestion] Publish to Composer in order to be able to `create-project`
Update your composer name and publish to https://packagist.org/ in order to be able to create a base project as Laravel installation, like:
composer create-project --prefer-dist cretueusebiu/laravel-vue-spa my-appcomposer install fails on master
composer v1.4.1
php v7.1
This is the end of composer install
Generating autoload files
> Illuminate\Foundation\ComposerScripts::postUpdate
> php artisan optimize
[Symfony\Component\Debug\Exception\FatalThrowableError]
Class 'Collective\Html\HtmlServiceProvider' not found
Script php artisan optimize handling the post-update-cmd event returned with error code 1
vagrant@homestead:/vagrant$ composer require laravelcollective/html
Using version ^5.4 for laravelcollective/html
./composer.json has been updated
Loading composer repositories with package information
Updating dependencies (including require-dev)
Package operations: 1 install, 0 updates, 0 removals
- Installing laravelcollective/html (v5.4.8): Loading from cache
Writing lock file
Generating autoload files
> Illuminate\Foundation\ComposerScripts::postUpdate
> php artisan optimize
[ReflectionException]
Class javascript does not exist
Script php artisan optimize handling the post-update-cmd event returned with error code 1
Installation failed, reverting ./composer.json to its original content.
File structure and CRUD
Hi,
I was wondering how this file structure would work with CRUD requests.
I created pages for users like so:
And I also created a module called users with all the funtionality. Although I feel it is the wrong approch to this structure. Is it possible you could add some code to show how to do this correctly?
Also what if I try to "show" a user and the API returns a 404? I find that there is no way to handle it apart from redirect to the page not found page, which isn't what I want to do. Instead I'd like to keep the URL the same and display the page not found.
Thanks for any help in advance.
Jamie
Just wondering...
I found your scripts a great material to learn the basics of how to scaffold SPA with VueJS. While I followed your code to see how and why things are laid out that way, I can't get the reason behind this:
laravel-vue-spa/resources/assets/js/components/App.vue
Lines 37 to 39 in d342a09
To me it doesn't seem it's necessary. Can you please tell me why you wrote the line? Thank you so much, and keep up the great work.
Loading pages with Vue
Hello,
When loading the "login" module from the laravel-vue-project (http://localhost/laravel-vue-spa/public/login) , I am getting a 404 (page not found).
What is the url to load the Vue pages (login/register)?
Thx,
David
how about basic tutorial ?
- how to create a new page and integrate it to the project?
- how to check user authenticated or not?
- how to async query backend for the data from custom page, previously created?
just simple and basic tutorial without explaination.
Remember me not working
Hello,
if you click remember me, i expected that a remember token is stored in the user table and used if session is expired to keep session alive.
Redundant basic layout
Hi,
basic layout appear twice, as Basic.vue and basic.vue.
Register driver -jwt-
I am trying to reuse your authentication methods in my current project but i dont know where you registered jwt driver , because i'm getting
'guards' => [
'web' => [
'driver' => 'session',
'provider' => 'users',
],
'api' => [
'driver' => 'jwt',
'provider' => 'users',
],
],
Auth guard driver [api] is not defined.
can you help me ?
L 5.5
Defualt Vuex Action?
Hi,
Is there a default vuex action? I noticed that in store/modules/auth you have fetchUser although I can't find where that is getting called, so my assumption is that there is a dynamic action call?
update:
I added the following code
try {
await store.dispatch('fetchDefault')
} catch (e) {}
to the router like so:
// Register before guard.
router.beforeEach(async(to, from, next) => {
if (!store.getters.authCheck && store.getters.authToken) {
try {
await store.dispatch('fetchUser')
} catch (e) {}
}
try {
await store.dispatch('fetchDefault')
} catch (e) {}
setLayout(router, to)
next()
})
Please let me know if there is a better way of approaching this problem.
Any help would be much appreciated.
Jamie
Whether you can load the js script as needed.
Use methods like vue-cli.
const Statistics = r => require.ensure([], () => r(require('@/components/statistics/statistics')), 'Statistics')Terminal found an installable set of packages.
Already cloned the repo.
When running composer install, I got
Your requirements could not be resolved to an installable set of packages.
Problem 1
- Installation request for doctrine/instantiator 1.1.0 -> satisfiable by doctrine/instantiator[1.1.0].
- doctrine/instantiator 1.1.0 requires php ^7.1 -> your PHP version (7.0.9) does not satisfy that requirement.
Problem 2
- doctrine/instantiator 1.1.0 requires php ^7.1 -> your PHP version (7.0.9) does not satisfy that requirement.
- phpunit/phpunit-mock-objects 4.0.4 requires doctrine/instantiator ^1.0.5 -> satisfiable by doctrine/instantiator[1.1.0].
- Installation request for phpunit/phpunit-mock-objects 4.0.4 -> satisfiable by phpunit/phpunit-mock-objects[4.0.4].
Does this really required to upgrade my php version? or is it safe to just remove this packages?
Thanks in advance
Hello,
this project is a great starting point. Working on two projects with this one as starting point and it's a pleasure.
Thank u very much!
Hmmm, - an issue :)
Hi!
I like your job!
But.
- how to fast fix localhost:8080 error, if im behind NAT and TWO proxying web-servers ?
it is possible to use FQDN on port 80 ? And how (im stuck).
Strange routing behaviour
I have some strange routing behaviour, so here is my route.js code (take a look at '/users/create'):
export default ({ authGuard, guestGuard }) => [
{ path: '/', name: 'welcome', component: require('~/pages/welcome.vue') },
// Authenticated routes.
...authGuard([
{ path: '/home', name: 'home', component: require('~/pages/home.vue') },
{ path: '/settings', component: require('~/pages/settings/index.vue'), children: [
{ path: '', redirect: { name: 'settings.profile' }},
{ path: 'profile', name: 'settings.profile', component: require('~/pages/settings/profile.vue') },
{ path: 'password', name: 'settings.password', component: require('~/pages/settings/password.vue') },
] },
{ path: '/users', name: 'users.index', component: require('~/pages/users/index.vue') },
{ path: '/users/:id', name: 'users.show', component: require('~/pages/users/show.vue') },
{ path: '/users/create', name: 'users.create', component: require('~/pages/users/create.vue') },
{ path: '/users/:id/edit', name: 'users.edit', component: require('~/pages/users/edit.vue') },
]),
// Guest routes.
...guestGuard([
{ path: '/login', name: 'login', component: require('~/pages/auth/login.vue') },
{ path: '/register', name: 'register', component: require('~/pages/auth/register.vue') },
{ path: '/password/reset', name: 'password.request', component: require('~/pages/auth/password/email.vue') },
{ path: '/password/reset/:token', name: 'password.reset', component: require('~/pages/auth/password/reset.vue') }
]),
{ path: '*', name: 'not-found', component: require('~/pages/errors/404.vue') }
]
And here is my vue for that route:
<template>
<div>
<h1>Users</h1>
<card :title="'Create User'">
<h3>Test</h3>
</card>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
loading: true,
}
</script>
As you can see it should be fine, although if you look at this Video you'll see that if I refresh the page I get a different vue and it makes an API call that it shouldn't. I've spend two solid days trying to figure it out and have gotten nowhere. Any ideas what it could be?
Socialite GitHub setup
I have issue while trying to setup github as my socialite provider, here's my github app config:
And my .env file is filled with client ID and client secret. The button appears on login and registration page, few times it created a popup for oauth, but after few times it stoped showing at all.
The config is almost untouched, except for the essentials like database connection and such.
Javascript error in prod env
Hi,
after
npm run prod
I get following javascript error on a clean installation:
Uncaught ReferenceError: webpackJsonp is not defined
Previous page and layout problem
Hi, just found an issue and don't know if that is a bug or not.
I created a new layout called "auth" for login and register page. Which mean if I have logged in, when I click logout button, I will redirect to login page and layout will change from "app" to "auth".
On this moment if I go back to previous page, it will redirect me to login page again, however layout will be "app" but not "auth".
I think the reason is "setLayout" function run before middleware, but I have no idea how to fix it.
give example
hi
u can wirte example how to get and send to the database
and how to use the route?
give us a few pages to see to to work with that more :)
great work!
change layout
I want to change the layout for login, how can I do this?
Not working
I have setup the all things. Run all the command you have specified but still not able to run the project.
When I type http://localhost:8080 It shows me Cannot GET /.
nginx vhost configuration
What should be the virtual host configuration file?
I have an error after click to register or login button:
POST http://localhost:8080/api/register 404 (Not Found)
dispatchXhrRequest @ xhr.js:177
xhrAdapter @ xhr.js:12
dispatchRequest @ dispatchRequest.js:52
createError.js:15 Uncaught (in promise) Error: Request failed with status code 404
at createError (createError.js:15)
at settle (settle.js:18)
at XMLHttpRequest.handleLoad (xhr.js:77)
createError @ createError.js:15
settle @ settle.js:18
handleLoad @ xhr.js:77
Uncaught (in promise) Error: Request failed with status code 404
at createError (createError.js:15)
at settle (settle.js:18)
at XMLHttpRequest.handleLoad (xhr.js:77)
createError @ createError.js:15
settle @ settle.js:18
handleLoad @ xhr.js:77
Guide
Write a quick guide for pages, layouts, routes and middleware.
Issue running this project in a place different than "/"
If I try to run this project in an apache envinronment with multiple other projects without Vhost to a root folder with different domain (ex.: http://dev.local/scherma/laravel-vue-spa/public/), it fails...
Is there a way to Laravel Mix to point straight to the right folder, like {{ asset('css/app.css') }} instead of mix , and also I did run npm run production and even so I get the error of webpackjsonp is not defined (missing manifest`` and vendor`, maybe) ...
The solution found was to manually edit the assets/views/ index.blade.php and scripts.blade.php to add the base-url. But even so the VueRouter gets buggy, trying to route to the /login instead of base-url/login :P
On-demand loading problem
Project files are all packaged in the app.js app.css file, too big. I do not know can be loaded on demand?
Using For Multi Domain Project to share session and cookie
How do you configure the project to be used for multiple domain project i have tried laravel recommended approach but doesnt seems to work and i have been working on this for like 2 days now. Any help on thisor any hint at all
Unexpected token
Hi,
I'm getting an "unexpected token" error when I run "npm run watch"
The error:
ERROR Failed to compile with 2 errors 11:02:35
error in ./resources/assets/js/plugins/i18n.js
Syntax Error: Unexpected token (17:27)
15 | export async function loadMessages (locale) {
16 | if (Object.keys(i18n.getLocaleMessage(locale)).length === 0) {
> 17 | const messages = await import(/* webpackChunkName: "lang-[request]" */ `~/lang/${locale}`)
| ^
18 | i18n.setLocaleMessage(locale, messages)
19 | }
20 |
@ ./resources/assets/js/app.js 6:0-34
@ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss
error in ./resources/assets/js/router/routes.js
Syntax Error: Unexpected token (1:22)
> 1 | const Welcome = () => import('~/pages/welcome')
| ^
2 | const Login = () => import('~/pages/auth/login')
3 | const Register = () => import('~/pages/auth/register')
4 | const PasswordEmail = () => import('~/pages/auth/password/email')
@ ./resources/assets/js/router/index.js 201:0-30
@ ./resources/assets/js/app.js
@ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss
Asset Size Chunks Chunk Names
\js\app.js 4.86 MB 0 [emitted] [big] \js\app
\css\app.css 1.79 MB 0 [emitted] [big] \js\app
ERROR in ./resources/assets/js/plugins/i18n.js
Module build failed: SyntaxError: C:/xampp/htdocs/overhoor/resources/assets/js/plugins/i18n.js: Unexpected token (17:27)
15 | export async function loadMessages (locale) {
16 | if (Object.keys(i18n.getLocaleMessage(locale)).length === 0) {
> 17 | const messages = await import(/* webpackChunkName: "lang-[request]" */ `~/lang/${locale}`)
| ^
18 | i18n.setLocaleMessage(locale, messages)
19 | }
20 |
@ ./resources/assets/js/app.js 6:0-34
@ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss
ERROR in ./resources/assets/js/router/routes.js
Module build failed: SyntaxError: C:/xampp/htdocs/overhoor/resources/assets/js/router/routes.js: Unexpected token (1:22)
> 1 | const Welcome = () => import('~/pages/welcome')
| ^
2 | const Login = () => import('~/pages/auth/login')
3 | const Register = () => import('~/pages/auth/register')
4 | const PasswordEmail = () => import('~/pages/auth/password/email')
@ ./resources/assets/js/router/index.js 201:0-30
@ ./resources/assets/js/app.js
@ multi ./resources/assets/js/app.js ./resources/assets/sass/app.scss
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.