2017-08-11 16 views
0

角のあるコミュニティ!Angular 4 Cliプロジェクトにng-bootstrapをインストール中にエラーが発生しました

昨日、これらの手順に従ってng-bootstrapを設定しました。Getting started with Ng-Bootstrapとすべてがうまくいきました。 今朝はいつものように私のng serve --openを開始し、私は、端末でこのメッセージました:

ERROR in multi ./src/styles.css ./~/font-awesome/css/font-awesome.min.css ./~/bootstrap/dist/css/bootstrap.min.css 
Module not found: Error: Can't resolve '/home/papamilo/Documents/Workspace/Test_a2json/front-end_copy_new/node_modules/bootstrap/dist/css/bootstrap.min.css' in '/home/papamilo/Documents/Workspace/Test_a2json/front-end_copy_new/node_modules/@angular/cli/models/webpack-configs' 
@ multi ./src/styles.css ./~/font-awesome/css/font-awesome.min.css ./~/bootstrap/dist/css/bootstrap.min.css 
webpack: Failed to compile 

`

:私はすべてのを見ることができない私は私のnode moduleフォルダに移動したときに非常に奇妙なことがあるのbootstrapフォルダ

私の角度-cli.json:

`{ 
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json", 
    "project": { 
    "name": "front-end" 
    }, 
"apps": [ 
{ 
    "root": "src", 
    "outDir": "dist", 
    "assets": [ 
    "assets", 
    "favicon.ico" 
    ], 
    "index": "index.html", 
    "main": "main.ts", 
    "polyfills": "polyfills.ts", 
    "test": "test.ts", 
    "tsconfig": "tsconfig.app.json", 
    "testTsconfig": "tsconfig.spec.json", 
    "prefix": "app", 
    "styles": [ 
    "styles.css", 
    "../node_modules/font-awesome/css/font-awesome.min.css", 
    "../node_modules/bootstrap/dist/css/bootstrap.min.css" 
    ], 
    "scripts": [ 
    "../node_modules/chart.js/dist/Chart.js", 
    "./assets/js/jquery-3.1.1.min.js", 
    "./responsive.js" 
    ], 
    "environmentSource": "environments/environment.ts", 
    "environments": { 
    "dev": "environments/environment.ts", 
    "prod": "environments/environment.prod.ts" 
    } 
    } 
    ], 
    "e2e": { 
    "protractor": { 
    "config": "./protractor.conf.js" 
    } 
    }, 
    "lint": [ 
    { 
    "project": "src/tsconfig.app.json" 
    }, 
    { 
    "project": "src/tsconfig.spec.json" 
    }, 
    { 
    "project": "e2e/tsconfig.e2e.json" 
    } 
    ], 
"test": { 
"karma": { 
    "config": "./karma.conf.js" 
    } 
    }, 
    "defaults": { 
"styleExt": "css", 
"component": {} 
    } 
} 

`

私のpackage.json:

`{ 
"name": "front-end", 
"version": "0.0.0", 
"license": "Private", 
"scripts": { 
"ng": "ng", 
"start": "ng serve", 
"build": "ng build", 
"test": "ng test", 
"lint": "ng lint", 
"e2e": "ng e2e" 
    }, 
    "private": true, 
    "dependencies": { 
"@angular/animations": "^4.0.3", 
"@angular/common": "^4.0.0", 
"@angular/compiler": "^4.0.0", 
"@angular/compiler-cli": "^4.1.0-rc.0", 
"@angular/core": "^4.0.0", 
"@angular/forms": "^4.0.0", 
"@angular/http": "^4.0.0", 
"@angular/platform-browser": "^4.0.0", 
"@angular/platform-browser-dynamic": "^4.0.0", 
"@angular/router": "^4.0.0", 
"@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.30", 
"@ngrx/store": "^4.0.0", 
"@swimlane/ngx-charts": "^5.3.1", 
"angular-highcharts": "^3.2.1", 
"angular2-highcharts": "^0.5.5", 
"chart.js": "^2.5.0", 
"core-js": "^2.4.1", 
"d3": "^4.9.1", 
"font-awesome": "^4.7.0", 
"highcharts": "^5.0.12", 
"rxjs": "^5.1.0", 
"typescript": "^2.2.1", 
"zone.js": "^0.8.4" 
    }, 
    "devDependencies": { 
"@angular/cli": "^1.2.1", 
"@angular/compiler-cli": "^4.0.0", 
"@types/highcharts": "^4.2.56", 
"@types/jasmine": "2.5.38", 
"@types/node": "~6.0.60", 
"canonical-path": "0.0.2", 
"codelyzer": "~2.0.0", 
"concurrently": "^3.2.0", 
"jasmine-core": "~2.5.2", 
"jasmine-spec-reporter": "~3.2.0", 
"karma": "~1.4.1", 
"karma-chrome-launcher": "~2.1.1", 
"karma-cli": "~1.0.1", 
"karma-coverage-istanbul-reporter": "^0.2.0", 
"karma-jasmine": "~1.1.0", 
"karma-jasmine-html-reporter": "^0.2.2", 
"lodash": "^4.16.4", 
"protractor": "~5.1.0", 
"rimraf": "^2.5.4", 
"ts-node": "~2.0.0", 
"tslint": "~4.5.0", 
"typescript": "~2.2.0" 
    } 
}` 

答えて

1

あなたのプロジェクトに追加しようと、ブートストラップ依存性が存在していないようです:

npm install [email protected] --save 

注:ng-bootstrap page says彼らが目指しているのブートストラップ4アルファ状態です

関連する問題