-2

I have added bootstrap to Angular Project using:

npm install --popper.js
npm install --jquery.js
npm install --bootstrap

--> It is added in the angular.json file as:

"styles": [
"src/assets/css/styles.css",
"./node_modules/bootstrap/dist/css/bootstrap.min.css"
]

and also in package.json as:

"dependencies": {
"bootstrap": "^4.2.1"
}

But my bootstrap classes like .btn .btn-primary, .form-group, .form-control are not working. Please help me with this. As our project is complex and needed to be loaded faster, please suggest me a solution that doesn't take longer loading time. (That means without imports/plugins inside the html or css files)

Gayathri Amirineni
  • 1
  • 1

1 Answers1

0

Just check in angular.json have you added these lines or not.

"styles": [
          "./node_modules/bootstrap/dist/css/bootstrap.min.css",
          "./node_modules/font-awesome/css/font-awesome.min.css",
          "src/styles.scss"
        ],
        "scripts": [
          "node_modules/jquery/dist/jquery.min.js",
          "node_modules/popper.js/dist/umd/popper.min.js",
          "node_modules/bootstrap/dist/js/bootstrap.min.js",
        ]

Export bootstarp in app module

app.module.ts

  exports: [],
  bootstrap: [AppComponent],
  schemas: [NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA]
MahanteshGowda Patil
  • 121
  • 7