Adding bootstrap in Symfony 4 - php

In my Symfony 4 project, I try to add bootstrap as an import after
yarn add bootstrap --dev
As I follow documentation, I tried to import bootstrap as follows:
#import "~bootstrap/scss/bootstrap";
When I run yarn encore dev, it says module not found.
Than I tried this:
#import "../../node_modules/bootstrap/scss/bootstrap.scss";
The output is:
Syntax Error: ModuleNotFoundError: Module not found: Error: Can't resolve './alert' in 'C:\Users\tolga\GIT\artifex\node_modules\bootstrap\scss'
What am I missing? alert.scss is there but it cannot find module. What should I try?

It seems I somehow solved the problem. First of all the import directory is this:
#import "../../node_modules/bootstrap";
I don't know why tilde didn't work. Adding sass-loader didn't help.

Old subject but the solution is to change the extension of file app.css to app.scss.

Related

Illuminate\Contracts\Container\BindingResolutionException - Target class [CommandMakeCommand] does not exist

Using Laravel 8.75 and trying to upgrade to php 8.1 in composer.json to "php": "^8.1" and receive the error of Illuminate\Contracts\Container\BindingResolutionException - Target class [CommandMakeCommand] does not exist.
Loading composer repositories with package information
Updating dependencies
Nothing to modify in lock file
Installing dependencies from lock file (including require-dev)
Nothing to install, update or remove
Package swiftmailer/swiftmailer is abandoned, you should avoid using it.
Use symfony/mailer instead.
Generating optimized autoload files
Illuminate\Foundation\ComposerScripts::postAutoloadDump
#php artisan package:discover --ansi
Illuminate\Contracts\Container\BindingResolutionException
Target class [CommandMakeCommand] does not exist.
at
vendor/laravel/framework/src/Illuminate/Container/Container.php:879
875▕
876▕ try {
877▕ $reflector = new ReflectionClass($concrete);
878▕ } catch (ReflectionException $e) {
879▕ throw new BindingResolutionException("Target class [$concrete] does not exist.", 0, $e);
880▕ }
881▕
882▕ // If the type is not instantiable, the developer is attempting to resolve
883▕ // an abstract type such as an Interface or Abstract Class and there is
+13 vendor frames
14 artisan:37
Illuminate\Foundation\Console\Kernel::handle()
Script #php artisan package:discover --ansi handling the post-autoload-
dump event returned with error code 1
i also had same problem, in my case nwidart/laravel-modules package upgraded to 8.3 version, i downgraded to 8.2 version and problem solved
see here: https://docs.laravelmodules.com/v9/introduction
If you have an existing config file, and you get an error:
Target class [CommandMakeCommand] does not exist
Then the config file will need updating first import the commands class:
use Nwidart\Modules\Commands;
Next replace the commands array with:
'commands' => [
Commands\CommandMakeCommand::class,
Commands\ComponentClassMakeCommand::class,
Commands\ComponentViewMakeCommand::class,
Commands\ControllerMakeCommand::class,
Commands\DisableCommand::class,
Commands\DumpCommand::class,
Commands\EnableCommand::class,
Commands\EventMakeCommand::class,
Commands\JobMakeCommand::class,
Commands\ListenerMakeCommand::class,
Commands\MailMakeCommand::class,
Commands\MiddlewareMakeCommand::class,
Commands\NotificationMakeCommand::class,
Commands\ProviderMakeCommand::class,
Commands\RouteProviderMakeCommand::class,
Commands\InstallCommand::class,
Commands\ListCommand::class,
Commands\ModuleDeleteCommand::class,
Commands\ModuleMakeCommand::class,
Commands\FactoryMakeCommand::class,
Commands\PolicyMakeCommand::class,
Commands\RequestMakeCommand::class,
Commands\RuleMakeCommand::class,
Commands\MigrateCommand::class,
Commands\MigrateRefreshCommand::class,
Commands\MigrateResetCommand::class,
Commands\MigrateRollbackCommand::class,
Commands\MigrateStatusCommand::class,
Commands\MigrationMakeCommand::class,
Commands\ModelMakeCommand::class,
Commands\PublishCommand::class,
Commands\PublishConfigurationCommand::class,
Commands\PublishMigrationCommand::class,
Commands\PublishTranslationCommand::class,
Commands\SeedCommand::class,
Commands\SeedMakeCommand::class,
Commands\SetupCommand::class,
Commands\UnUseCommand::class,
Commands\UpdateCommand::class,
Commands\UseCommand::class,
Commands\ResourceMakeCommand::class,
Commands\TestMakeCommand::class,
Commands\LaravelModulesV6Migrator::class,
],
Just add this line:
use Nwidart\Modules\Commands\CommandMakeCommand;
in first of config/modules.php file as a namespace
Above namespace will resolve only commandMakeCommand issue, but if you want to set all command namespace then you need to add the namespace at the top.
namespace Nwidart\Modules\Commands;
Hope this helps (backup your project first):
First remove nwidart/laravel-modules by running: composer remove nwidart/laravel-modules
Then remove config/modules.php by deleting it.
Reinstall nwidart/laravel-modules by running: composer require nwidart/laravel-modules
Source:
Githubhot, the answer by mohamedsharaf
If someone is still looking for the answer so follow these steps
As mentioned in this link see here: https://docs.laravelmodules.com/v9/introduction
If you have an existing config file, and you get an error:
Target class [CommandMakeCommand] does not exist
Then the config file will need updating first import the commands class, and in your config folder update the modules.php file includes
use Nwidart\Modules\Commands;
Then replace the commands array with: add Commands\ before each value or simple copy and replace the array
'commands' => [
Commands\CommandMakeCommand::class,
Commands\ComponentClassMakeCommand::class,
Commands\ComponentViewMakeCommand::class,
Commands\ControllerMakeCommand::class,
Commands\DisableCommand::class,
Commands\DumpCommand::class,
Commands\EnableCommand::class,
Commands\EventMakeCommand::class,
Commands\JobMakeCommand::class,
Commands\ListenerMakeCommand::class,
Commands\MailMakeCommand::class,
Commands\MiddlewareMakeCommand::class,
Commands\NotificationMakeCommand::class,
Commands\ProviderMakeCommand::class,
Commands\RouteProviderMakeCommand::class,
Commands\InstallCommand::class,
Commands\ListCommand::class,
Commands\ModuleDeleteCommand::class,
Commands\ModuleMakeCommand::class,
Commands\FactoryMakeCommand::class,
Commands\PolicyMakeCommand::class,
Commands\RequestMakeCommand::class,
Commands\RuleMakeCommand::class,
Commands\MigrateCommand::class,
Commands\MigrateRefreshCommand::class,
Commands\MigrateResetCommand::class,
Commands\MigrateRollbackCommand::class,
Commands\MigrateStatusCommand::class,
Commands\MigrationMakeCommand::class,
Commands\ModelMakeCommand::class,
Commands\PublishCommand::class,
Commands\PublishConfigurationCommand::class,
Commands\PublishMigrationCommand::class,
Commands\PublishTranslationCommand::class,
Commands\SeedCommand::class,
Commands\SeedMakeCommand::class,
Commands\SetupCommand::class,
Commands\UnUseCommand::class,
Commands\UpdateCommand::class,
Commands\UseCommand::class,
Commands\ResourceMakeCommand::class,
Commands\TestMakeCommand::class,
Commands\LaravelModulesV6Migrator::class,
],
You can try to downgrade nwidart/laravel-modules version in composer.json file. Just change this line to the below line.
"nwidart/laravel-modules": "8.2.*"
Then delete composer.lock file and now, run this command.
composer install
If previous reply doesn't work for you,
If still not work after changing the version in composer.json as well as deleting the composer.lock and vendors, you can fix the version like this
"nwidart/laravel-modules": "8.2.*"
delete composer.lock and vendor and run
composer install
This Is Not Related Routes Or Any Other Parts Of Your App ,
When You Cant Run Composer Update Or Artisan Commands
You Have Problem In Booting Laravel , In This Case :
Go To Your Config Folder Open Modules File And Check "Command" Key
My Problem Fixed By This Way !
Good Day !

Can't import "bootstrap-select" in app.scss in Laravel

I'm doing following:
npm install bootstrap-select
npm run dev
in app.scss
// Bootstrap Select
#import "node_modules/bootstrap-select/sass/bootstrap-select.scss";
In console it says:
jQuery.Deferred exception: $(...).selectpicker is not a function
TypeError: $(...).selectpicker is not a function
I can see it installed bootstrap-select, how do I import it correctly?
In your /resources/assets/sass/app.scss import bootstrap-select:
#import "../../../node_modules/bootstrap-select/sass/bootstrap-select.scss";
You also need to import bootstrap-select.js to resources/assets/js/app.js make it work:
require('../../../node_modules/bootstrap-select/dist/js/bootstrap-select');
Its possible to add Bootstrap-Select without the complete path:
require('bootstrap-select');
require('bootstrap-select/js/i18n/defaults-de_DE');
#import '~bootstrap-select/sass/bootstrap-select.scss';
in laravel 5.7
in app.scss
#import '~bootstrap-select/sass/bootstrap-select.scss';
in app.js
require('../../node_modules/bootstrap-select/dist/js/bootstrap-select.min');
npm install bootstrap-select
npm run dev
In resources\assets\sass\app.scss
#import "node_modules/bootstrap-select/sass/bootstrap-select.scss";
in resources\assets\js\app.js
require('../../../node_modules/bootstrap-select/dist/js/bootstrap-select.js');
Add app.scss in head
Add app.js before end of body

Use PrimerCSS.io in Laravel 5.5

I am building an app with Laravel & I want to build it with PrimerCSS.io and remove Bootstrap completely.
I followed the docs, but I could not complete it.
I replaced #import "~bootstrap-sass/assets/stylesheets/bootstrap";
with
#import "primer-css/index.scss"; in
resources/assets/sass/app.scss and ran npm run watch.
But encountered problem
Module build failed:
#import "primer-css/index.scss;
File to import not found or unreadable:
Here's what I got to work with a fresh install of Laravel 5.5 (this Laracasts post led me on the right track).
First, we need to use the includePaths option for node-sass:
// webpack.mix.js
let mix = require('laravel-mix');
mix.js('resources/assets/js/app.js', 'public/js')
.sass('resources/assets/sass/app.scss', 'public/css', {
includePaths: ["node_modules"]
});
Then, we can just include the primer-css index.scss file:
// resources/assets/sass/app.scss
#import "~primer-css/index";
(Note that the above ~ is equivalent to ../../../node_modules/)

The Mix manifest does not exist when it does exist

For my admin panel I extract all the assets including the manifest-json.js to mix.setPublicPath(path.normalize('public/backend/')).
All the files get correctly added to the backend folder, and the manifest-json.js file looks as follows:
{
// all correct here
"/js/vendor.js": "/js/vendor.js",
"/js/app.js": "/js/app.js",
"/css/app.css": "/css/app.css",
"/js/manifest.js": "/js/manifest.js"
}
the problem is that when using
{{ mix('backend/css/app.css') }}
in my blade-files, it looks in public/manifest-json.js instead of looking for it in backend/manifest-json.js.
How can I make sure the right manifest-json.js file is used?
I had same exception after deployment laravel project to server. It was working perfectly fine on localhost but after lot of research I found a solution. If you encounter this exception on server then you have to bind your public path to public_html
Just go to under the app/Providers, you will find your AppServiceProvider file and inside boot() method make the binding as below.
$this->app->bind('path.public', function() {
return base_path().'/../public_html';
});
i solved my problem running this command
npm install
and then
npm run production
Thank You.
The problem I faced was that the mix()-helper function by default looks for the manifest-json file in /public/manifest-json.js so if you store that file on any other directory level then it will throw that error.
Let's say the manifest-json file is stored in public/app/manifest-json.js, then for a file located in public/app/css/app.css you would use:
<link rel="stylesheet" href="{{ mix('css/app.css', 'app') }}">
The mix()-helper function allows for a second argument, the directory of the manifest file. Just specify it there and it will use the correct manifest file.
i have same problem as questioner: manifest does not exist for solving it what i have done is ran 2 commands as following:
npm install
and then
npm run dev
and the error is solved now. yippi.
In shared hosts and laravel 5.6 tested:
after doing standard levels such as explained here;
two levels needed:
in app/Providers/AppServiceProvider.php:
$this->app->bind('path.public', function() {
return realpath(base_path().'/../public_html');
});
and in public_html file make .htaccess file with content:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php?/$1 [L]
</IfModule>
<IfModule !mod_rewrite.c>
ErrorDocument 404 /index.php
</IfModule>
source: here
this file most change for some situations.
that's all and solved my problem
I had the same issue with a Laravel package, its assets were not published:
This solved the issue for me:
php artisan vendor:publish --tag=telescope-assets --force
Sources:
https://github.com/laravel/telescope/issues/136
https://github.com/laravel/telescope/issues/250
There are 3 ways to solve it, I summarize what the colleagues said above:
The problem is because, you are using mix() in the views.
<link rel="stylesheet" href="{{ mix('dist/css/app.css') }}">
solution 1
change it to this.
<link rel="stylesheet" href="{{ asset('dist/css/app.css') }}">
solution 2
If you don't have root access:
Modify the App\Providers\AppServiceProvider file and add the following to the boot() method.
$this->app->bind('path.public', function() {
return base_path().'/../public_html';
});
solution 3
if you have root access run:
npm install & npm run dev
try the following commands:
npm install
npm run dev
I have same exception after deployment laravel project to (shared) server when trying to reach the login and register page. It works fine on local machine.
I kept the file and folder structure the same as on my local environment (all files that our in the public folder locally are in the public_html folder on the server).
The solution mentioned above seems to work. Adapted to my file and folder structure I added the following code to AppServiceProvider file and inside boot() method.
$this->app->bind('path.public', function() {
return realpath(base_path().'/public_html');
});
The only issue now is that the CSS of the login, register and dashboard page is messed up. I'm totally new to Livewire, I have no clue how to fix that.
You should run this commands to install npm dependencies and make your frontend files:
$ npm install
$ npm run dev //or production
Now you're done and you can run your laravel project:
$ php artisan serve
In a shared hosting environment, Remove the mix e.g. {!! script(mix('js/manifest.js')) !!}
should be changed to
{!! script('js/manifest.js') !!}
This actually works for me
I got the same error
because when I run
npm install
npm run dev
I got some error.
It was fixed when I updated my nodejs version.
I'm just posting maybe someone would need it.
For me it's worked when I changed in my blade file css and js pointed path. As bellow:
In my blade was this:
<link rel="stylesheet" href="{{ mix('dist/css/app.css') }}">
I changed the MIX to ASSET as:
<link rel="stylesheet" href="{{ asset('dist/css/app.css') }}">
Also the same on JS file to:
<script src="{{ asset('dist/js/app.js') }}"></script>
If it's the same thing for everybody, in my case laravel-mix seems to be not installed so without changing any files I just installed laravel-mix by running:
npm install laravel-mix#latest --save-dev
For bind your public path to public_html, in file index.php add this 3 lines:
$app->bind('path.public', function() {
return __DIR__;
});
This is work for me on shared hosting
Try to Add your public route to your app/Providers/AppServiceProvider.php
public function register()
{
$this->app->bind('path.public',function(){
return'/home/hosting-name-folder/public_html';
});
}
Directory Structure like this
--- public
--- app
--css
--app.css
--js
--app.js
Import css js in laravel blade file like this
<link rel="stylesheet" href="{{ asset('app/css/app.css') }}">
<script src="{{ asset('app/js/app.js') }}" type="text/javascript"></script>
If you are having this issue with Laravel Nova or telescope then perhaps you are really missing mix-manifest file. You should have that file inside public/vendor/toolname/
Where toolname can be Nova or Telescope. If you have that folder, you should go ahead and put in your server otherwise you will first have to publish the assets & then put it on server.
I change resources/layouts/guest.blade.php and resources/layouts/app.blade.php
<!-- Styles -->
<link rel="stylesheet" href="{{asset('css')}}/app.css">
<!-- Scripts -->
<script src="{{asset('css')}}js/app.js"></script>
and resources/css and resources/js copy my public folder
The Mix manifest does not exist.
You can solve this problem by updating the node version.
actually when you run command npm run dev,
show the error message "Error: You are using an unsupported version of Node. Please update to at least Node v12.14"
so easily you can fix it by updating the node js version
Thanks
if your previous setup is correct.but you are looking this type of error it shows The Mix manifest does not exist. then write these command .
npm ci
npm run dev
I resolved my problem by this command :
npm install
npm run dev
Worked for me on a fresh install of Laravel 9 with Jetstream(using Laradock).
npm run install && npm run development
When running npm run dev the mix was not compiling the files and creating the mix-manifest.json
step1
npm install
npm run production
step 2
refresh by simply closing and opening the project
step 3
replace <link rel="stylesheet" href="{{ mix('css/app.css') }}">
with
<link rel="stylesheet" href="/css/app.css/">
Here you go!!!!!
I got the same problem when hosting on cpanel
just change from
{{ mix('backend/css/app.css') }}
Becomes
{{ asset('backend/css/app.css') }}
it's solve my problem.
don't forget to upvote if this answer help u
There are a lot of answers to these questions, I am posting this question just in case if any miss these points.
Method: 1
Make sure to check the .gitignore file. sometimes it's listed there and doesn't make the file be pushed to git repo
Method: 2
Add this code in webpack.mix.js so you will exactly know where it's placing the mix-manifist.json file
mix.webpackConfig({
output: {
path: __dirname + "/public"
}
});
I had the issue on a shared host, where I was not able to run npm commands. Then I used the simplest way. In the /vendor/laravel/.../Foundation/Mix.php replace
i$manifests[$manifestPath] = json_decode(file_get_contents($manifestPath), true);
to
$manifests[$manifestPath] = json_decode(file_get_contents('https://your-domain.com/mix-manifest.json'), true);
Not recommended, but it works. You can use it as your last try.
Faced the same problem on both Windows and Ubuntu. Solved it on Ubuntu (and I presume the solution is simillar in Windows). The problem was due to the fact that my installed npm version was too old.
The solution for me was the following. I installed nvm (NodeVersionManager -version 0.39.1) which allowed me to switch to the latest stable version of node (v16.14.0) and then install npm 8.5.0.
Detailed steps:
Linux bash terminal commands:
touch ~/.bash_profile ~/.bashrc ~/.zshrc ~/.profile
sudo apt install curl
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash
logout and login Ubuntu user
nvm --version
nvm ls-remote
nvm install 16.14.0
node --version
...then inside the laravel project:
npm ci
npm install -g npm#8.5.0
npm audit fix
npm run dev
Try out this one!!
<script src="{{ asset('js/app.js') }}" defer></script>
It works for me
I found new solution
The problem is mix manifest right?
So just redirect to the mix manifest feature. for example, you have:
{{ style(mix('css/backend.css')) }}
just change your code into
{{ style('css/backend.css') }}
it works for me

behat.yml in app/config instead of root directory

I installed behat with mink and selenium2-driver for my Symfony2 project.
Is it possible to use the /app/config/behat.yml instead of the /behat.yml file?
I searched on google but I can't find anything else this command.
php bin/behat --config app/config/behat.yml
But the command isn't working either.
I think there must be a config-path in composer.json.
Yes, you can configure which config file you want to use. Look at this part of the doc.
http://docs.behat.org/guides/7.config.html#paths
What error do you get when running your command?
php bin/behat --config app/config/behat.yml
This error?
[RuntimeException]
Context class not found.
Maybe you have provided a wrong or no `bootstrap` path in your behat.yml:
http://docs.behat.org/guides/7.config.html#paths
If that's the case, I think if might be because you need to specify where to find the features in your behat.yml file.
Now you moved the file to /app/config/behat.yml, the related path from behat.yml to the feature directory has changed, so you should add the following to the file:
default:
paths:
features: ../features/
bootstrap: ../features/bootstrap

Categories