ディレクトリ 'bootstrap'を解決できません

Question

an angular starterをダウンロードしました。私はそれにブートストラップをインストールしようとしています。彼らはExternal Stylesheet sectionでそれを行う方法を説明します。

私がインストールしたブートストラップ：その後、

npm i bootstrap --save 
npm i bootstrap-sass --save 

とはstyles.scssの最上部に追加：

@import 'bootstrap/scss/bootstrap.scss'; 

しかし、それは赤でマークされています言及：

Cannot resolve directory 'bootstrap'

どれをヘルプは深く感謝されます！

Answer 1

前述のように、CSS内で読み込むときにチルダを追加する必要があります。

@import 'bootstrap/scss/bootstrap.scss'; 

第二に、ブートストラップCSSファイルは、それが親戚のパスを使用していますので、あなたが抱えているエラーになり、スタイルシートと一緒にフォントをロードしているWebPACKのどこがピックアップに知りません。

$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap"; 
@import "~bootstrap-sass/assets/stylesheets/bootstrap"; 

をそして、あなたのWebPACKの設定にフォントローダーを追加します：

それを修正するには、from hereを見られるように、次のように正しいものにフォルダのパスを変更することができますいずれか

{ 
    test: /\.(eot|svg|ttf|woff|woff2)$/, 
    loader: 'url-loader', 
} 

---

しかし、問題を回避する最も簡単な方法は、あなたが行っているスタイルのインポートを削除し、bootstrap-sassの依存関係を削除することですd代わりにcdnを使用してください。

@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'); 

これを行う利点は、このcdnを使用してブートストラップをダウンロードしたクライアントがキャッシュされたバージョンを取得することです。多くのウェブサイトではこの記事を使用していますので、再度ダウンロードする必要はありません。また、それをホストしたりバンドルに組み込んだりする手間が省けます。

Answer 2

sass-loadersassモジュールをmode_modulesフォルダからインポートするには、モジュールパスの先頭に~を付けます。そうでなければ提供パスは、相対的なもののように解決されています

@import "~bootstrap/scss/bootstrap.scss"; 

詳細情報についてはsass-loader docsをチェックしてください。あなたがfont-得るでしょう

@import "~bootstrap-sass/assets/stylesheets/bootstrap"; 

：

Answer 3

何も経由して、あなたが手動/ペースト（またはダウンロード）をコピーすることができますので、そこbootstrap.scssファイル、src/styles/bootstrap/scss/bootstrap.scssに存在しないか、またはちょうどあなたのnode_modulesからあなたsrc/styles/styles.scssにブートストラップをインポート関連のエラー、あなたがその前の行に追加するまで、ので、あなたのstyles.scss読み取り：

$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 
@import "~bootstrap-sass/assets/stylesheets/bootstrap"; 

より：https://stackoverflow.com/a/35575175/3814251

を