I created a fresh laravel 5.3 project inside my xampp localhost environment. I went to the home page and it appeared as usual, with the pretty styles and all. But there is the new artisan command make:auth that sets-up a functioning registration system. But when I go to the register or login page, it should appear with the pretty styles, but instead it's appearing like this:
Any help?
I had the same problem. In my case I noticed that my app.css was empty. Solved it by using the following commands:
php artisan auth vue
npm install
npm run dev
Reference that I used for this problem with Laravel 6: Laravel 6.0 app.js only has require('.bootstrap');?
Try this
-Make sure that you are extending the master layout file(the default or your custom one)
-changes links like this
<link rel="stylesheet" type="text/css" href="{{asset('css/mycss')">
Share more code please if this did not work (folder structure , register.php)
Related
I create company profile website using laravel 5.8 and vue js for make it reactive, it's not SPA(single page application) maybe we can call it hybrid, everything run well in local, after i modify javasacript locally then run a command yarn watch to compile and run my web again it runs well. let's say i have uploaded my project to shared hosting. then i modify my javascript code then re-upload my app.js code and here's a problem. the browser loads my previous app.js not my new app.js. i have cleared browser cache it's sill load the previous app.js. how to solve this problem?
thanks
put a random number at the end of address like this:
<script type="text/javascript" src="app.js?v=12392823"></script>
Better option is to add .version() to your webpack mix file:
mix.js('resources/js/app.js', 'public/js')
.version();
After that, when you call mix('js/app.js') in your view, it will add the cache busting get parameters automatically and the parameter will ONLY change if the file has been changed.
I have aproblem. I built a project using Laravel 5.8 and it depends on the select2 plugin. I did everything correctly. But after compiling the project
npm run dev
I have the following exception:
Uncaught TypeError: $(...).select2 is not a function
I know what has to be done. jQuery is connecting twice in this project. At first in my .blade.php:
{{asset('adminlte/bower_components/jquery/dist/jquery.min.js')}}
and a second time after compiling (npm run dev), the Laravel, by itself, does it in public/js/app.js
window.$ = window.jQuery =
__webpack_require__(/*! jquery */ "./node_modules/jquery/dist/jquery.js");
If I delete this code, I don't see the issue and select2 works correctly.
Here is the compiled code from public/js/app.js
It says: code may be modified to fit the specific needs of your application.
Does anyone know how to hide this line after compilation?
Or should I delete this code after each compiling turn?
You have to remove it from the source file which is at resources/assets/js/bootstrap.js and compile it again with npm run dev.
Or you could just import select2 inside that file so the user has to download fewer files.
You should never modify the compiled files in public/ since the changes will disappear after compilation.
I'm new to laravel and I'm using laravel 5.6 but the problem is when I run auth:make command it execute and display some login field and register field. My question is why front end desing is not working after running auth:make command in laravel. I have uploaded image it shows only html content but front-end desing is not showing.
Go to :
app/resources/views/auth/layouts/app.blade.php.
find this (line 20 probably):
<link href="{{ asset('css/app.css') }}" rel="stylesheet">
and replace it with this:
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
it works for me laravel 8.x.
https://laravel.com/docs/5.6/frontend
While Laravel does not dictate which JavaScript or CSS pre-processors you use, it does provide a basic starting point using Bootstrap and Vue that will be helpful for many applications. By default, Laravel uses NPM to install both of these frontend packages.
So if you want to use default "front end design" (bootstrap) that comes default by Laravel, and want to use method that Laravel recommends(npm) than you must follow the documentation above.
Did you install node and npm then run the following commands in your laravel root directory ?
npm install
npm run dev
These commands compile related javascript and scss/css files and build your front end.
Also following are some other documents about this subject :
Installation of Node & npm :
https://www.digitalocean.com/community/tutorials/how-to-install-node-js-on-ubuntu-16-04
https://nodejs.org/en/
https://www.npmjs.com
Laravel Mix And the Front-end :
https://laracasts.com/series/laravel-from-scratch-2017/episodes/14?autoplay=true
I am now developing a project with Laravel 5.4
I need to add an Admin Panel over this existing project, but from what I see, there are quite few options for that.
One option is AdminLTE, but documentation on installing over existing project is very undetailed.
It also requires me to delete default Laravel Auth Controller, which is really not an option for me, because I've done a lot of changes in it.
Can you please recommend any admin panel that would be easy to install on existing project ?
Or should I write it myself ? But I'm not sure I can handle it.
i can recommend you a voyager package for laravel 5
step:1 composer require tcg/voyager
step:2 set up your .env file
step:3 put following 2 line in your app.php
TCG\Voyager\VoyagerServiceProvider::class,
Intervention\Image\ImageServiceProvider::class,
step:4 php artisan voyager:install
step:5 run your migration -> php artisan migrate
and then go to
localhost:8000/admin
or whatever your server is
Here I would recommend you to adopt a Laravel admin panel which I am using it already. That was the best Admin template which I've seen in recent days. Name of the product is Josh and available on Codecanyon.
Here is the link of the product where you can get it
https://codecanyon.net/item/josh-laravel-admin-template-front-end-crud/8754542?s_rank=9
You don't even need to follow the installation instruction provided by AdminLTE. As its a frontend template, just copy the css and js files of AdminLTE to your Laravel's public folder. Then take the html pages that you need from AdminLTE. You need to update the css and js links of that html with the new path of those file in your Laravel(use asset method).
Supposition: You are with Laravel 5.4
Add admin-lte Laravel package with:
composer require "acacha/admin-lte-template-laravel:4.*"
To register the Service Provider edit config/app.php file and add to providers array:
Acacha AdminLTE template provider
Acacha\AdminLTETemplateLaravel\Providers\AdminLTETemplateServiceProvider::class,
To Register Alias edit config/app.php file and add to alias array:
Acacha AdminLTE template alias
'AdminLTE' => Acacha\AdminLTETemplateLaravel\Facades\AdminLTE::class,
Finally Publish files with:
php artisan vendor:publish --tag=adminlte --force
Use force to overwrite Laravel Scaffolding packages. That's all! Open the Laravel project in your browser or homestead machine and enjoy!
I'd like to involve jQuery Smart Wizard in my application.
I have update the composer.json and then run composer update.
Here I get the related files in the vendor folder as techlab\smartwizard.
How could I link the css and js file from the twig template?
I have tried to use below command to generate link to the resources.
php bin\console assets:install --symlink --relative
It seems that the command only deal with the folder in resources\Public in each Bundle.
I hope I could use some link as below to get the files.
<link rel="stylesheet" href="{{ asset('bundles/XXX/static//styles/XXX.css') }}">
I know I could create CSS and JS folder under web folder and then copy the related files there. I just wonder if I have to do this manually then why I use composer to install it. I could just download the file and put them in the target folder. That's all.
I am not sure if there is some better way to manage the resource.
Thank you very much for your help.
assets:install command works only if it finds directories/files in Resources/public directory.
I see two options here:
1) create a bundle and add the files in the Resources public directory
2) use bower and install this package as a dependency for frontend.
For this, you may create a `.bowerrc` file to set the
target directory which can be `web/bower`.
Composer is used to manage php dependencies, not frontend ones, except somebody made a package to work with composer and to be integrated in framework.
So, you can use:
1) composer -> php related, backend dependencies
2) bower, npm -> frontend dependencies
I use a precompiler with gulp that manages css, images and js files in the project
Try
php bin\console
To
php bin/console
Where in your command line