你可能需要一个合适的加载器来处理这个文件类型：Webpack 2答案

【问题标题】：You may need an appropriate loader to handle this file type: Webpack 2你可能需要一个合适的加载器来处理这个文件类型：Webpack 2
【发布时间】：2017-06-20 05:05:04
【问题描述】：

我已升级到 Webpack 2，但我的加载器出现问题。我的项目结构如下：

.
├── components
│   └── App.js
│ 
├── public
│     └──css
│         └──custom.css
└── src
     └──sass
         └──custom.scss

App.js 内部

import '../src/sass/custom.scss'

在 webpack.config.js 中的 module.exports =

{
  test: /\.scss$/,
  exclude: /node_modules/,
  loaders: ExtractTextPlugin.extract({ fallbackLoader: 'style-loader', loader: 'sass-loader' }),
  include: __dirname + '/src/sass'
}

在 webpack.config.js 插件中

//Add Bourbon dependency
  new webpack.LoaderOptionsPlugin({
    options: {
      sassLoader: {
        includePaths: require('bourbon').includePaths,
        outputStyle: 'expanded',
      },
      context: '/src/sass',
    }
  })

我在 package.json 中的生产脚本

"production": "rm -rf public/index.html && NODE_ENV=production webpack -p && NODE_ENV=production node app.js"

但我收到此错误：

**Child extract-text-webpack-plugin:
       [0] ./~/sass-loader!./src/sass/custom.scss 283 bytes {0} [built] [failed] [1 error]**

ERROR in ./~/sass-loader!./src/sass/custom.scss
Module parse failed: /Users/user/apps/project/node_modules/sass-loader/index.js!/Users/user/apps/project/src/sass/custom.scss Unexpected token (1:5)
You may need an appropriate loader to handle this file type.
| body {
|   background: white;
| }

我不知道为什么它找不到我的装载机。我已经重新安装了所有东西（css、sass、样式加载器），甚至把它们放在了开发和生产依赖部分。

似乎有很多关于 webpack 2 的问题和糟糕的文档。我在这里有什么遗漏吗？

【问题讨论】：

我不确定这只是复制粘贴还是拼写错误，但您确定您正在导入正确的内容吗？在您的文件夹结构中，您调用了 scss 但之后您从 sass 而不是 scss 导入。 kr，乔治
是的，对不起，这是一个错字。仍然没有快乐。

标签： npm webpack loader webpack-2 extract-text-plugin

【解决方案1】：

我相信，如果您使用的是正则表达式测试，那么您就不需要 !style-loader!sass-loader!在你的进口。解析整个字符串时可能会导致问题。

【讨论】：

我已经更新了上面的代码，但仍然出现错误。另外值得一提的是，当我运行webpack 时，public/css 中没有生成 custom.css 样式表。我的设置好吗？