0

我已升级到 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 和糟糕的文档似乎有很多问题。我在这里有什么遗漏吗?

4

1 回答 1

0

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

于 2017-02-02T22:58:20.200 回答