Laravel with JetStream and LiveWire not rendering (Tailwind) - laravel-8

I started a new project in Laravel 8 with Jetstream and LiveWire.
It seems everything ok, but I'm not able to show correctly the auth pages.
I created a new laravel project.
I installed the jetstream package with LiveWire
https://jetstream.laravel.com/2.x/installation.html
This is the result of login page:
The css is not working.

After days of workaround on this issue, I found the problem.
After npm run dev, the console display the following line:
You have enabled the JIT engine which is currently in preview.
Documentation Here
For now I changed mode: 'JIT' to mode: '' in file tailwind.config.js
The project seems to work.

Related

Vue Inertia Shows #routes when I load the page

I am using Vue js with laravel using Inertia. I installed the required packages and it was working fine then I committed the code and cloned the same from my office system. Now when I open the page it shows #routes.
I am using Ziggy by tighten and I re-installed all those packages but It shows the same.
Thanks.

How to use Laravel sanctum with Breeze

I have installed Laravel Breeze and then Sanctum. But, it is not working as it should. Please guide me, how can I set up it?
I want to create the admin panel with Laravel Breeze and Vue application for the front users.
For a start you can install Breeze with Vue + Inertia scaffolding unless you're implementing everything by hand using API calls with Sanctum. First option is easier to implement.
php artisan breeze:install vue
php artisan migrate
npm install
npm run dev
https://laravel.com/docs/9.x/starter-kits#laravel-breeze

Vue.js devtools not detecting Vue.js in standalone installation, already allowed access to file URLs

I have a vue.js + laravel installation project on my local server where the Vue.js devtools detects Vue.js and I'm able to use it. However, when I do a standalone Vue.js installation using 'vue create', Vue.js is not detected by devtools. I already allowed access to file URLs under chrome extension but it is still not working. The devtools was detecting Vue.js in the laravel version just fine without allowing access to file URLS.
Is there something else basic that I'm missing to get Vue.js devtools to work? There must be a simple step I missed because there should be loads of people creating fresh Vue.js projects on local server and getting devtools to work.
I'm using 'npm run serve' to run Vue.js in localhost, is this supposed to be detected by Vue.js devtools by default?
solved by reinstalling Vue.js 2 instead of the Vue.js 3 preview version as of 2020-08-26.

Correct way to create a theme from scratch in Angular 8 (Bootstrap)

I am new to Angular 8. I am confused in creating the theme for Angular 8. I searched for this in many site but they are using the jQuery and Popper.js. So, jQuery is the reason that's why I am confused.
What is the correct way to implement the bootstrap theme in Angular. Can we implement it without using jQuery?
Install Bootstrap
run npm install bootstrap
Add bootstrap.scss to your angular.json file
projects->yourproject->architect->options->styles Add
"styles": ["node_modules/bootstrap/scss/bootstrap.scss"]
If you are after JS interactions like dropdowns..etc , install ng-bootstrap
run npm install --save #ng-bootstrap/ng-bootstrap
Doco: https://ng-bootstrap.github.io/#/components/alert/examples
Done. No JQuery or Popper.js required

Nuxt js Google Tag Manager JQuery problem

I have installed #nuxtjs/google-tag-manager module and configure it. Then i start project in production and jquery stopped working. I mean no clicks and other jquery events working.
Have anyone else experienced the same issue? What did i do wrong?
I use latest version of nuxt 2.