How to install and use Bootstrap via Composer

Question

How to install and use Bootstrap via Composer

Asked 6 years, 10 months ago

Viewed 4,300 times

0

Hello, People how can I use Bootstrap in a project managed by Composer, I know that the command Composer require twbs/bootstrap Composer will download and place the files in the folder vendor project, how do I add the code on the pages.

<link href="./vendor/twbs/bootstrap/dist/bootstrap.css">

Obeying the following project structure:

projeto/
---logs/
---public/
---src/
---template/
---tests/
---vendor/
---composer.json
---composer.lock

That would be the right thing to do?

I believe this is not the most advisable, is there anything I can do to directly add? Ex: <link href="./public/assets/bootstrap.css">

1

Composer, despite having support for this, was not made for this. Use others as yarn, npm etc. But if you want, there is a link that can help: https://getcomposer.org/doc/faqs/how-do-i-install-a-package-to-a-custom-path-for-my-framework.md

– Valdeir Psr

2018/02/19 at 23:56
Look, I’m no good with this one commiserate and I could not set as monstra in the link you sent... follows my link file Composer.json {
 "require": {
 "composer/installers": "~1.0",
 "php": ">=5.5.0",
 "slim/slim": "^3.1",
 "slim/php-view": "^2.0",
 "monolog/monolog": "^1.17",
 "twbs/bootstrap": "3.3.7"
 },
 "extra": {
 "installer-paths": {
 "public/assets/{$name}": ["vendor/package"]
 }
 },
 "require-dev": {
 "phpunit/phpunit": ">=4.8 < 6.0"
 },
 "autoload-dev": {
 "psr-4": {
 "Tests\\": "tests/"
 }
 }
}


– Luis Calegari

2018/02/20 at 00:36

1 answer

Browser other questions tagged php commiserate

You are not signed in. Login or sign up in order to post.

by AnthraxisBR • **4,361** points · Answer 1 · 2018-02-20T00:40:28+00:00

It’s not the best mode, but you can do it by just importing in the project by Composer.json:

{
   "name": "projeto/projeto",
   "description": "descricao.",
   "authors": [
      {
         "name": "nome",
         "email": "[email protected]"
      }
   ],
   "require": {
      "components/jquery": "^3.2",
      "twbs/bootstrap": "4.0.0"
   }
}

Or by the terminal:

Composer require Components/jquery

Composer require twbs/bootstrap

And then include the files that are on /vendor:

<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
<script src="vendor/components/jquery/jquery.min.js"></script>
<script src="vendor/twbs/bootstrap/dist/js/bootstrap.min.js"></script>

Obs:

Bootstrap 4 will ask to include the helper Tether., just include your CDN path BEFORE of the bootstrap Javascript file, making these files necessary.

<link href="vendor/twbs/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
<script src="vendor/components/jquery/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.3/js/tether.min.js"></script>
<script src="vendor/twbs/bootstrap/dist/js/bootstrap.min.js"></script>

Obs 2:

If the initial file (index) is in public, where the path to the file indicates to return a folder before the full path:

../vendor/path/to/o/file.format