download.md 4.55 KB
Newer Older
1
---
Mark Otto's avatar
Mark Otto committed
2
layout: docs
3
title: Download
Tanguy Krotoff's avatar
Tanguy Krotoff committed
4
description: Download Bootstrap to get the compiled CSS and JavaScript, source code, or include it with your favorite package managers like npm, RubyGems, and more.
5
group: getting-started
6
toc: true
7
8
---

Mark Otto's avatar
Mark Otto committed
9
## Compiled CSS and JS
10

Mark Otto's avatar
Mark Otto committed
11
Download ready-to-use compiled code for **Bootstrap v{{ site.current_version}}** to easily drop into your project, which includes:
12

Mark Otto's avatar
Mark Otto committed
13
14
- Compiled and minified CSS bundles (default, grid-only, and Reboot-only)
- Compiled and minified JavaScript plugins
15

Mark Otto's avatar
Mark Otto committed
16
17
18
This doesn't include documentation, source files, or any optional JavaScript dependencies (jQuery and Popper.js).

<a href="{{ site.download.dist }}" class="btn btn-bd-purple" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download Bootstrap');">Download</a>
19

20
## Source files
Mark Otto's avatar
Mark Otto committed
21
22
23
24
25
26

Compile Bootstrap with your own asset pipeline by downloading our source Sass, JavaScript, and documentation files. This option requires some additional tooling:

- Sass compiler (Libsass or Ruby Sass is supported) for compiling your CSS.
- [Autoprefixer](https://github.com/postcss/autoprefixer) for CSS vendor prefixing

Cory Becker's avatar
Cory Becker committed
27
Should you require [build tools]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/build-tools/#tooling-setup), they are included for developing Bootstrap and its docs, but they're likely unsuitable for your own purposes.
Mark Otto's avatar
Mark Otto committed
28

Mark Otto's avatar
Mark Otto committed
29
<a href="{{ site.download.source }}" class="btn btn-bd-purple" onclick="ga('send', 'event', 'Getting started', 'Download', 'Download source');">Download source</a>
30

31
## Bootstrap CDN
32

Mark Otto's avatar
Mark Otto committed
33
Skip the download with the Bootstrap CDN to deliver cached version of Bootstrap's compiled CSS and JS to your project.
34
35
36
37
38
39

{% highlight html %}
<link rel="stylesheet" href="{{ site.cdn.css }}" integrity="{{ site.cdn.css_hash }}" crossorigin="anonymous">
<script src="{{ site.cdn.js }}" integrity="{{ site.cdn.js_hash }}" crossorigin="anonymous"></script>
{% endhighlight %}

Mark Otto's avatar
Mark Otto committed
40
41
42
43
44
45
46
If you're using our compiled JavaScript, don't forget to include CDN versions of jQuery and Popper.js before it.

{% highlight html %}
<script src="{{ site.cdn.jquery }}" integrity="{{ site.cdn.jquery_hash }}" crossorigin="anonymous"></script>
<script src="{{ site.cdn.popper }}" integrity="{{ site.cdn.popper_hash }}" crossorigin="anonymous"></script>
{% endhighlight %}

Mark Otto's avatar
Mark Otto committed
47
48
## Package managers

49
Pull in Bootstrap's **source files** into nearly any project with some of the most popular package managers. No matter the package manager, Bootstrap will **require a Sass compiler and [Autoprefixer](https://github.com/postcss/autoprefixer)** for a setup that matches our official compiled versions.
Mark Otto's avatar
Mark Otto committed
50

Mark Otto's avatar
Mark Otto committed
51
### npm
52

53
Install Bootstrap in your Node.js powered apps with [the npm package](https://www.npmjs.com/package/bootstrap):
54

55
{% highlight sh %}
56
npm install bootstrap@{{ site.current_version }}
57
{% endhighlight %}
Mark Otto's avatar
Mark Otto committed
58

Mark Otto's avatar
Mark Otto committed
59
`require('bootstrap')` will load all of Bootstrap's jQuery plugins onto the jQuery object. The `bootstrap` module itself does not export anything. You can manually load Bootstrap's jQuery plugins individually by loading the `/js/*.js` files under the package's top-level directory.
Mark Otto's avatar
Mark Otto committed
60

Mark Otto's avatar
Mark Otto committed
61
62
Bootstrap's `package.json` contains some additional metadata under the following keys:

XhmikosR's avatar
XhmikosR committed
63
- `sass` - path to Bootstrap's main [Sass](http://sass-lang.com/) source file
Mark Otto's avatar
Mark Otto committed
64
65
- `style` - path to Bootstrap's non-minified CSS that's been precompiled using the default settings (no customization)

66
67
### RubyGems

68
Install Bootstrap in your Ruby apps using [Bundler](https://bundler.io/) (**recommended**) and [RubyGems](https://rubygems.org/) by adding the following line to your [`Gemfile`](https://bundler.io/gemfile.html):
69
70

{% highlight ruby %}
béla's avatar
béla committed
71
gem 'bootstrap', '~> 4.0.0.beta'
72
73
74
75
{% endhighlight %}

Alternatively, if you're not using Bundler, you can install the gem by running this command:

76
{% highlight sh %}
béla's avatar
béla committed
77
gem install bootstrap -v 4.0.0.beta
78
79
80
81
{% endhighlight %}

[See the gem's README](https://github.com/twbs/bootstrap-rubygem/blob/master/README.md) for further details.

Mark Otto's avatar
Mark Otto committed
82
### Composer
Mark Otto's avatar
Mark Otto committed
83

XhmikosR's avatar
XhmikosR committed
84
You can also install and manage Bootstrap's Sass and JavaScript using [Composer](https://getcomposer.org/):
Mark Otto's avatar
Mark Otto committed
85

86
{% highlight sh %}
87
composer require twbs/bootstrap:{{ site.current_version }}
Mark Otto's avatar
Mark Otto committed
88
89
{% endhighlight %}

90
91
### NuGet

XhmikosR's avatar
XhmikosR committed
92
If you develop in .NET, you can also install and manage Bootstrap's [CSS](https://www.nuget.org/packages/bootstrap/) or [Sass](https://www.nuget.org/packages/bootstrap.sass/) and JavaScript using [NuGet](https://www.nuget.org/):
93
94

{% highlight powershell %}
95
96
97
98
99
Install-Package bootstrap -Pre
{% endhighlight %}

{% highlight powershell %}
Install-Package bootstrap.sass -Pre
100
101
102
{% endhighlight %}

The `-Pre` is required until Bootstrap v4 has a stable release.