角6:找不到名字‘引导盒’

Question

我正在尝试在我的角度应用程序中使用引导程序。我遵循了这个answer的说明。但是当我建造这个项目的时候

错误TS2304:找不到名称‘引导箱’。

我的package.json文件

"dependencies": {
    "@angular/animations": "6.0.2",
    "@angular/common": "6.0.2",
    "@angular/compiler": "6.0.2",
    "@angular/core": "6.0.2",
    "@angular/forms": "6.0.2",
    "@angular/http": "6.0.2",
    "@angular/platform-browser": "6.0.2",
    "@angular/platform-browser-dynamic": "6.0.2",
    "@angular/router": "6.0.2",
    "ag-grid": "17.1.1",
    "ag-grid-angular": "17.1.0",
    "angular2-tree-component": "3.1.0",
    "bootbox": "^4.4.0",
    "bootstrap": "^3.3.7",
    "core-js": "2.5.4",
    "install": "^0.11.0",
    "jquery": "3.3.1",
    "mydatepicker": "2.6.3",
    "ng2-webstorage": "2.0.0",
    "primeng": "6.0.0-alpha.1",
    "rxjs": "6.0.0",
    "rxjs-compat": "6.1.0",
    "zone.js": "0.8.26"
},
"devDependencies": {
    "@angular-devkit/build-angular": "~0.6.3",
    "@angular/cli": "~6.0.3",
    "@angular/compiler-cli": "6.0.2",
    "@angular/language-service": "6.0.2",
    "@types/bootbox": "^4.4.32",
    "@types/bootstrap": "^4.1.0",
    "@types/core-js": "0.9.46",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/jquery": "^3.3.1",
    "@types/node": "8.9.5",
    "codelyzer": "~4.2.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~1.7.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~1.4.2",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "0.2.2",
    "protractor": "~5.3.0",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "~2.7.2"
}

我的angular.json

"scripts": [
    "node_modules/core-js/client/shim.min.js",
    "src/assets/js/Chart.bundle.min.js",
    "node_modules/jquery/dist/jquery.js",
    "node_modules/bootstrap/dist/js/bootstrap.js",            
    "node_modules/bootbox/bootbox.js",
    "src/assets/js/custom.js"
]

我相信，我已经正确地遵循了指示，但找不到我做错了什么。

Answer 1

步骤1:安装jquery、bootstrap，然后使用npm安装bootbox

步骤2:在您的angular.json (angular-cli.json for angular-cli.json <= v5)文件中，在scripts部分添加以下内容

"node_modules/jquery/dist/jquery.js",
"node_modules/bootstrap/dist/js/bootstrap.js",            
"node_modules/bootbox/bootbox.js",  

步骤3:安装类型

npm install @types/jquery --save
npm install @types/bootbox --save

步骤4:构建项目并检查构建是否成功。如果构建是成功的，那么就在这里结束。

步骤5:如果构建不成功，则在src文件夹下创建一个名为typings.d.ts的文件，并添加以下内容并构建项目。这应该能解决问题。

declare var bootbox: any;

Answer 2

尝试在组件中导入引导框文件，如-

 import * as bootbox from 'bootbox/bootbox.js'