Adding Bootstrap (or any other CSS framework) to Vue is fairly straightforward. In this example, I’ll install the entire Bootstrap CSS library (without javascript, no jquery, no popper.js, which are dependencies if you want everything Bootstrap).
First, install bootstrap to your project using npm
or yarn
:
npm install bootstrap
// or
// yarn add bootstrap
Next, in your main App
component, import Bootstrap:
<style>
@import '~bootstrap/dist/css/bootstrap.css'
/* Rest of css here... */
</style>
Since the App
component is essentially the global scope for your app, all elements can utilize Bootstrap styles.