File tree 1 file changed +43
-0
lines changed
docs/documentation/stories
1 file changed +43
-0
lines changed Original file line number Diff line number Diff line change
1
+ # Include [ Bootstrap] ( http://getbootstrap.com/ )
2
+
3
+ [ Bootstrap] ( http://getbootstrap.com/ ) is a popular CSS framework which can be used within an Angular project.
4
+ This guide will walk you through adding bootstrap to your Angular CLI project and configuring it to use bootstrap.
5
+
6
+ Create a new project and navigate into the project
7
+ ```
8
+ ng new my-app
9
+ cd my-app
10
+ ```
11
+
12
+ With the new project created and ready you will next need to install bootstrap to your project as a dependency.
13
+ Using the ` --save ` option the dependency will be saved in package.json
14
+ ```
15
+ // version 3.x
16
+ npm install bootstrap --save
17
+
18
+ // version 4.x
19
+ npm install bootstrap@next --save
20
+ ```
21
+
22
+ Now that the project is set up it must be configured to include the bootstrap CSS.
23
+
24
+ Open the file ` angular-cli.json ` from the root of your project.
25
+ Under the property ` apps ` the first item in that array is the default application.
26
+ There is a property ` styles ` which allows external global styles to be applied to your application.
27
+ Specify the path to ` bootstrap.min.css `
28
+ ```
29
+ // version 3.x and 4.x
30
+ "../node_modules/bootstrap/dist/css/bootstrap.min.css"
31
+ ```
32
+
33
+ With the application configured, run ` ng serve ` to run your application in develop mode.
34
+ In your browser navigate to the application ` localhost:4200 ` .
35
+ Make a change to your application to ensure that the CSS library has been included.
36
+ A quick test is to add the following markup to ` app.component.html `
37
+ ```
38
+ <button class="btn btn-primary">Test Button</button>
39
+ ```
40
+ After saving this file, return to the browser to see the bootstrap styled button.
41
+
42
+
43
+ ** Note:** When you make changes to ` angular-cli.json ` you will need to re-start ` ng serve ` to pick up configuration changes.
You can’t perform that action at this time.
0 commit comments