codeitlikemiley / vuetified Goto Github PK
View Code? Open in Web Editor NEWLaravel Starter App Using Vue ,Vuetify, and InertiaJS.
License: MIT License
Laravel Starter App Using Vue ,Vuetify, and InertiaJS.
License: MIT License
@codeitlikemiley I've really enjoyed this - so thank you very much.
Is it possible to do this same setup except using the quasar framework?
I'm too thick to get the passport authentication stuff to work as it should, hence why I love this vuetified.
However, I think I'd like the way quasar framework is set up (more complete?).
Testing out Veutified. Followed the instructions and got it working without a problem.
When modifying the frontend and running webpack, all function that import components generate the error.
Unexpected token
Example of statements that fail is:
const Dashboard = () => import("Pages/Account/Dashboard.vue");
The babel config file from the repository is unchanged. I tried to add es2015 to the presets but without success.
Any pointer would be appreciated.
Hi,
after running this command:
npm run watch
i get error:
ERROR Failed to compile with 1 errors 16:12:37
error in ./resources/assets/js/components/VLink.vue
Module build failed: Error: ENOENT: no such file or directory, open '/home/nadhir/p/Vuetified/resources/assets/js/components/VLink.vue'
just i fixed it by renaming this file from:
/resources/assets/js/components/Vlink.vue
to
/resources/assets/js/components/VLink.vue
When compiling production
assets with yarn prod
, there is an error on the page, and nothing showing except spinner
Uncaught ReferenceError: webpackJsonp is not defined
at app.js?id=4510d0b84af0f58015f3:1
(anonymous) @ app.js?id=4510d0b84af0f58015f3:1
Seems like this error is caused because files 0.js
, 1.js
, etc doesn't load to the page
I believe the readme.md
is a bit out of date, at least for Ubuntu, this is the sequence that worked for me:
git clone https://github.com/codeitlikemiley/vuetified YOURPROJECTNAME
cd YOURPROJECTNAME
sudo apt-get install php-imagick
composer require spatie/pdf-to-image
composer install
yarn
cp .env.example .env
// edit .env with DB details, used: nano .env
php artisan key:generate
php artisan migrate:fresh --seed
php artisan passport:install
To launch on localhost: php artisan serve
composer install command fails
$ composer install
Loading composer repositories with package information
Installing dependencies (including require-dev) from lock file
Your requirements could not be resolved to an installable set of packages.
Problem 1
- Installation request for spatie/pdf-to-image 1.8.1 -> satisfiable by spatie/pdf-to-image[1.8.1].
- spatie/pdf-to-image 1.8.1 requires ext-imagick * -> the requested PHP extension imagick is missing from your system.
Problem 2
- spatie/pdf-to-image 1.8.1 requires ext-imagick * -> the requested PHP extension imagick is missing from your system.
- spatie/laravel-medialibrary 7.6.0 requires spatie/pdf-to-image ^1.2 -> satisfiable by spatie/pdf-to-image[1.8.1].
- Installation request for spatie/laravel-medialibrary 7.6.0 -> satisfiable by spatie/laravel-medialibrary[7.6.0].
To enable extensions, verify that they are enabled in your .ini files:
- /usr/local/etc/php/7.3/php.ini
- /usr/local/etc/php/7.3/conf.d/ext-opcache.ini
- /usr/local/etc/php/7.3/conf.d/php-memory-limits.ini
You can also run `php --ini` inside terminal to see which files are used by PHP in CLI mode.
OneStepAtATime:laravel_vuetified kunalpunjabi$
Hey, would you please get me through, the implementation of the social auth,
let's take google or which ever provider you are comfortable with.
Just an example.
Thanks.
Hey,
This is great work I must say.
But there is one thing bugging me, I just run npm install, then npm run dev to publish the assets but on looking at the browser console, I found out that the app.js file is more than 10mbs.
Could you be having any suggestions or reasons as to why this is the case?
Before you can run php artisan passport:install
you must run php artisan migrate
.
Also, after creating .env, run php artisan key:generate
Unrelated: Can I ignore these warnings from yarn install
:
warning " > [email protected]" has unmet peer dependency "babel-core@6 || 7 || ^7.0.0-alpha || ^7.0.0-beta || ^7.0.0-rc".
warning " > [email protected]" has unmet peer dependency "webpack@2 || 3".
warning " > [email protected]" has unmet peer dependency "css-loader@*".
warning " > [email protected]" has unmet peer dependency "webpack@^2.0.0 || ^3.0.0".
Created a New Laravel Preset
Using Latest Version as of Dec 05 2019
Laravel 6.6.0
This Allows You To Create SPA that is Super Fast You Only Load A Page Component Assets
When you Visit it , and No Need Extra Overhead for VUEX since you can Access Session
and Send it Right Back as A Props
Define in app/Providers/AppServiceProvider.php
You Can Create a Normal Page
by adding Vue SFC on resource/js/Pages
Define your Route at routes/web.php
as simple as
Route::get('/', function() {
Inertia::render('component_name_in_pages_directory')
});
You Can Always override Your Root view
Default is app.blade.php
Inertia::setRootView('welcome.blade.php')
It also comes with goodies you have in VSCODE, phpcs and eslint for fixing ,linting code.
Also Now Comes with Extra packages Such as larastan, phpinsights to help your code
Be Error Free and Compliant before even running a php unit test..
If you wanna intall this just run
composer require codeitlikemiley/vuetified-laravel-preset
php artisan preset vuetified
npm run dev or npm run watch
for more info on inertia js click here
I have been all over the web and tried several solutions but none is working, is there anything anything custom that we should know with regards to private channel auth, I have raised the issue in stack overflow, and at the moment no answers yet or comments,
you can follow the link for details issue
private channel 403 error
this happens only for private channels though with public channels, everything is working fine.
And also there is something else not in the above link is that I added the 'auth:api' middleware in the Broadcast::routes() in the BroadcastServiceProvider
I don't understand where is the Auth part of the application?
How i can make Login / Register call with the passport component ?
I wanted to use your app, I really did. But why is every word uppercased? You gave me a vertigo, I can't read that at all.
Friendly advice - don't do that. Don't uppercase every word. It's IMPOSSIBLE to read.
Best of luck.
I want to display Laravel validation messages in Vue components. When using the helper methods from http.js
I can set the errors correctly using form.errors.set(errors)
. But auth.js
is using vueAuth instead of http.js
and here errors
always return undefined
although the API is returning the correct validation errors. Any ideas?
Returns errors:
async login ({ commit, dispatch }, form) {
try {
await App.post(route('api.auth.login'), form).then(() => {
commit('isAuthenticated', {
isAuthenticated: vueAuth.isAuthenticated()
})
})
} catch ({errors, message}) {
console.log(errors)
}
}
Returns undefined:
async login ({ commit, dispatch }, form) {
try {
await vueAuth.login(form).then(() => {
commit('isAuthenticated', {
isAuthenticated: vueAuth.isAuthenticated()
})
})
} catch ({errors, message}) {
console.log(errors)
}
}
https://github.com/codeitlikemiley/vuetified-ssr
This is A Fully Optimized Laravel SSR App...
Laravel as Api, Node and Nuxt for SSR, Vuetify and Vue for Ui...
Uses Fontawesome 5 , and base64 Roboto fonts
For Blazing Fast TTB around 31 ms...
Built For SEO
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.