Welcome Guest, Not a member yet? Register   Sign In
CI 4 integration with Bootstrap 5
#1

Apart from using CDN or manually downloading Bootstrap files, what would be the best way to integrate Bootstrap 5 into a version controlled Ci 4 Application so that it will be easy to bring in its updates in future ?
Reply
#2

(This post was last modified: 09-12-2022, 01:06 AM by captain-sensible.)

it depends whether your going straight for ready css or scss which has certain advantages over css. So you can either change values of bootstrap or another way is to override them. if you go for scss you will need something like grunt or gulpfile to compile scss back into css.

My current approach is to use scss ; i also use fontawesome . The way I tie it all together is via one style sheet which inside i have :

Code:
@import url("bootstrap.css");
@import url("custom.css");
@import url("font-face.css");


Its in that order for a purpose. Anything in custom can over ride that which I want to of bootstrap.

Now if you go to packagist.org you can use composer to say get scss : https://packagist.org/packages/twbs/bootstrap

Or alternatives: https://packagist.org/packages/twitter/bootstrap . Using composer update should update anything in the composer.json file which you get when first using composer for anything.

For js I just downloaded and put in a dir called js , which is inside public. I have

Code:
[andrew@darkstar:kursaal.org/public]$ tree -L 1 js                                                                                                            (09-12 09:01)
js
├── bk
├── bootstrap.bundle.js
├── jquery-3.5.1.min.js
├── jquery-migrate-3.3.0.js
├── jquery-migrate.js
└── popper.js

1 directory, 5 files
[andrew@darkstar:kursaal.org/public]$


in my layout i also have :

Code:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

can't remember why but it fixed some issues.

So in summary if you go composer route, you can install CI4 that way and also other stuff. When you run composer update , it will update everything thats in composer.json IF updates are available and for CI4 , if the CI4 update is appropriate for your version of php .
CMS CI4     I use Arch Linux by the way 

Reply
#3

For smaller projects or libraries where I don’t want to use a bundler I often use asset-packagist.org. You can check out my composer.json file for an example: https://github.com/tattersoftware/codeigniter4-frontend

You might also be interested in that library, or it’s parent Tatter\Assets; at least should have some helpful examples.
Reply
#4

thanks my issue has been fixed.
Reply




Theme © iAndrew 2016 - Forum software by © MyBB