javascript - 使用vue webpack-simple解析css失败

Question

我创建了一个 webpack-simple 项目，如下所述:https://github.com/vuejs-templates/webpack-simple .

接下来，我使用 npm install vue-codemirror --save 安装了 vue-codemirror ( link )。在main.js中，导入并使用了vue-codemirror。

import CodeMirror from 'vue-codemirror';
Vue.use(CodeMirror);

但是，运行 npm run dev 会产生所有 codemirror css 错误。错误看起来都是这样的:

ERROR in ./~/codemirror/addon/dialog/dialog.css
Module parse failed: C:\Users\aidan\Code\ludum-dare-37\node_modules\codemirror\addon\dialog\dialog.css Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
| .CodeMirror-dialog {
|   position: absolute;
|   left: 0; right: 0;
 @ ./~/babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./~/vue-codemirror/codemirror.vue 99:6-51
 @ ./~/vue-codemirror/codemirror.vue
 @ ./~/vue-codemirror/index.js
 @ ./src/main.js
 @ multi main

Answer 1

我需要安装样式加载器

npm install style-loader --save-dev

然后将其添加到webpack.config.js。具体来说，我添加了以下模块规则:

{
    test: /\.css$/,
    loader: "style-loader!css-loader"
},