Блог

Я установил bootstrap и jQuery в свой проект Angular, а также импортировал их в файл Angular.json, но я не могу использовать какие-либо функции jQuery и JavaScript.

Кнопка переключения не работает при небольшом размере экрана, и кнопка X при предупреждении также не работает, однако все мои стили работают нормально

Это мой компонент навигационной панели

 lt;nav class="navbar navbar-expand-md bg-dark navbar-dark"gt;   lt;a class="navbar-brand" href="#"gt;Navbarlt;/agt;   lt;button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar"gt;  lt;span class="navbar-toggler-icon"gt;lt;/spangt;  lt;/buttongt;   lt;div class="collapse navbar-collapse" id="collapsibleNavbar"gt;  lt;ul class="navbar-nav"gt;  lt;li class="nav-item"gt;  lt;a class="nav-link" href="#"gt;Linklt;/agt;  lt;/ligt;  lt;li class="nav-item"gt;  lt;a class="nav-link" href="#"gt;Linklt;/agt;  lt;/ligt;  lt;li class="nav-item"gt;  lt;a class="nav-link" href="#"gt;Linklt;/agt;  lt;/ligt;  lt;/ulgt;  lt;/divgt; lt;/navgt; lt;div class="alert alert-success alert-dismissible"gt;  lt;button type="button" class="close" data-dismiss="alert"gt;amp;times;lt;/buttongt;  lt;stronggt;Success!lt;/stronggt; Indicates a successful or positive action. lt;/divgt;  

Это мой угловой файл.json

 {  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",  "cli": {  "analytics": false  },  "version": 1,  "newProjectRoot": "projects",  "projects": {  "my-blog": {  "projectType": "application",  "schematics": {  "@schematics/angular:application": {  "strict": true  }  },  "root": "",  "sourceRoot": "src",  "prefix": "app",  "architect": {  "build": {  "builder": "@angular-devkit/build-angular:browser",  "options": {  "outputPath": "dist/my-blog",  "index": "src/index.html",  "main": "src/main.ts",  "polyfills": "src/polyfills.ts",  "tsConfig": "tsconfig.app.json",  "assets": [  "src/favicon.ico",  "src/assets"  ],  "styles": [  "src/styles.css",  "node_modules/bootstrap/dist/css/bootstrap.min.css"  ],  "scripts": [  "node_modules/jquery/dist/jquery.js",  "node_modules/bootstrap/dist/js/bootstrap.js",  "node_modules/popper.js/dist/popper.js"    ]  },  "configurations": {  "production": {  "budgets": [  {  "type": "initial",  "maximumWarning": "500kb",  "maximumError": "1mb"  },  {  "type": "anyComponentStyle",  "maximumWarning": "2kb",  "maximumError": "4kb"  }  ],  "fileReplacements": [  {  "replace": "src/environments/environment.ts",  "with": "src/environments/environment.prod.ts"  }  ],  "outputHashing": "all"  },  "development": {  "buildOptimizer": false,  "optimization": false,  "vendorChunk": true,  "extractLicenses": false,  "sourceMap": true,  "namedChunks": true  }  },  "defaultConfiguration": "production"  },  "serve": {  "builder": "@angular-devkit/build-angular:dev-server",  "configurations": {  "production": {  "browserTarget": "my-blog:build:production"  },  "development": {  "browserTarget": "my-blog:build:development"  }  },  "defaultConfiguration": "development"  },  "extract-i18n": {  "builder": "@angular-devkit/build-angular:extract-i18n",  "options": {  "browserTarget": "my-blog:build"  }  },  "test": {  "builder": "@angular-devkit/build-angular:karma",  "options": {  "main": "src/test.ts",  "polyfills": "src/polyfills.ts",  "tsConfig": "tsconfig.spec.json",  "karmaConfig": "karma.conf.js",  "assets": [  "src/favicon.ico",  "src/assets"  ],  "styles": [  "src/styles.css"  ],  "scripts": [  ]  }  }  }  }  },  "defaultProject": "my-blog" }