sass - Webpack - 如何为 sass 加载器配置基本目录路径？

Question

我正在尝试遵循一些教程和文档，并将 webpack 构建为我的 sass 文件到单独的 css 文件中。

只要我在 require 中证明完整的相对路径，它都可以工作:
require("../sass/ss.scss")
但我想使用它:
require("./ss.scss")
然后我将配置中的“sassLoader”注释掉，出现错误:
[1] "sassLoader" is not allowed
如您所见，我也一直在尝试使用内联设置:
sourceMap&includePaths[]=' + (PATHS.sass)
但它们被忽略了。

我究竟做错了什么？

const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const validate = require('webpack-validator');
const merge = require('webpack-merge');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

const PATHS = {
  app: path.join(__dirname, 'app'),
  js: path.join(__dirname, 'app', 'js'),
  sass: path.join(__dirname, 'app', 'sass'),
  build: path.join(__dirname, 'build')
};

const common = {

  // Entry accepts a path or an object of entries.
  // We'll be using the latter form given it's
  // convenient with more complex configurations.
  entry: {
    app: path.join(PATHS.js, 'index.js')
  },
  output: {
    path: PATHS.build,
    filename: '[name].js'
  },
  plugins: [
    new HtmlWebpackPlugin({
      title: 'Webpack demo'
    }),
    new ExtractTextPlugin(
      '[name].css', {
        allChunks: true
      }
    ),
  ],
  devtool: "source-map",
  module: {
    loaders: [
      {
        test: /\.scss$/,
        loader: ExtractTextPlugin.extract(
          'style!css?sourceMap!sass?sourceMap&includePaths[]=' + (PATHS.sass)
        )
      }
    ]
  }
  // sassLoader: {
  //   includePaths: [PATHS.sass]
  // }
};


var config;

// Detect how npm is run and branch based on that
switch(process.env.npm_lifecycle_event) {
  case 'build':
    config = merge(common,
      {}
    );
    break;
  default:
    config = merge(common,
      {}
    );
}

module.exports = validate(config);

Answer 1

错误来自 webpack-validator因为它不能识别 sassLoader属性(property)。您需要配置一个 schema extension :

const Joi = require('webpack-validator').Joi

const schemaExtension = Joi.object({
  sassLoader: Joi.any(),
})

module.exports = validate(config, {schemaExtension: schemaExtension})