Невозможно импортировать CSS из npm в webpack

Question

Я не могу понять правильное заклинание, чтобы вытащить bootstrap.css в мой проект Webpack/React. Когда WebPack строит свой проект, я получаю следующее сообщение об ошибке:

ERROR in ./app/js/XXXXXX/XXXXXX.jsx 
Module not found: Error: Cannot resolve module 'bootstrap/css/bootstrap.css' in /Volumes/Doomsday Device/XXXXXX 
@ ./app/js/XXXXXX/XXXXX.jsx 27:0-38 

В исходном файле, у меня есть следующий импорт:

import React from 'react'; 
import LinkedStateMixin from 'react-addons-linked-state-mixin'; 

require('bootstrap/css/bootstrap.css'); 

import Nav  from 'react-bootstrap/lib/Nav'; 
import NavItem from 'react-bootstrap/lib/NavItem'; 

В моем webpack.config.js, у меня есть:

module.exports = { 
    ... 
    module: { 
     loaders: [ 
      { test: /\.jsx?$/, loaders: ['react-hot', 'babel-loader'], include: APP_PATH }, 
      { test: /\.scss$/, loaders: ["style", "css", "sass"] }, 
      { test: /\.css$/, loaders: ["style", "css"] }, 
      { test: /\.(png|jpe?g|gif)$/, loader: "file-loader?name=img/img-[hash:6].[ext]" } 
     ] 
    }, 
    .... 
} 

Я добавил бутстрап в качестве зависимости в package.json:

{ 
    ... 
    "dependencies": {}, 
    "devDependencies": { 
    ... 
    "bootstrap": "^3.3.6", 
    "css-loader": "^0.19.0", 
    ... 
    }, 
    ... 
} 

Любые идеи относительно того, почему может быть неправильно? Благодаря!

Answer 1

Похоже, что вы ввели неверный путь, попробуйте импортировать его из bootstrap/dist/css/bootstrap.css