webpack引入css报错cannot resolve module ‘style’？

正确安装了webpack以及相关插件和依赖，
webpack.config.js配置如下：

module.exports = {
    entry: './entry.js',
    output: {
        path: __dirname, 
        filename: 'bundle.js' 
    },
    module: {
        loaders: [
            {test: /\.js$/, exclude: /node_modules/, loader: 'react-hot!babel'},
            {test: /\.css$/, loader: 'style!css'}
        ]
    }
};

entry.js引入css：

import './node_modules/semanticui/dist/style.css';

style.css里就写了一条：

body {
    color: red;
}

然后在命令行里启动一下，一切正常，css成功引入。
但是我把style.css替换成同目录下的semantic.css，修改下配置，启动后会报错：

ERROR in ./entry.js
Module not found: Error: Cannot resolve module 'semantic' in /Users/zaxlct/Desktop/react-first

webpack.config.js是这么配置的 ：

{test: /\.css$/, loader: 'semantic!css'}

entry.js是这么写的：

import './node_modules/semantic-ui/dist/semantic.css';

注：semantic-ui是 直接 npm install semantic下载到项目里的，个人感觉问题出在semantic上，但是不知道具体怎么解决

附上 semantic.css前几行代码：

@import url('https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic&subset=latin');
*,
*:before,
*:after {
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
}

input[type="text"],
input[type="email"],
input[type="search"],
input[type="password"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  /* mobile firefox too! */
}