css - webpack を使用してフォントと CSS を分離する

Question

私が達成しようとしているのは、フォントを使用して .less を .css ファイルに抽出し、それぞれを次のように別々のディレクトリに配置することです。

web/
   assets/
      css/
         - style.css
      fonts/
         - glyphicons-halflings-regular.eot
      js/
         - style.js

しかし重要なのは、css ファイルが同じレベルの fonts ディレクトリを示しているということです。

スタイル.css

...src:url(./fonts/glyphicons-halflings-regular.eot)...

webpack.config.js

const path = require("path");

const webpack = require("webpack");

const merge = require('webpack-merge');
const validate = require('webpack-validator');

const parts = require('./lib/parts');

const PATHS = {
    style: path.join(__dirname, 'sources', 'less'),
    build: path.join(__dirname, '..', 'web/assets')
};

const common = {
    entry: {
        style: PATHS.style
    },
    output: {
        path: PATHS.build,
        filename: './js/[name].[chunkhash].js',
        chunkFilename: '[chunkhash].js',
        publicPath: 'assets/'
    }
};

var config;

switch (process.env.npm_lifecycle_event) {
    case 'build':
        config = merge(
            common,
            parts.extractStyles(PATHS.style)
        );
        break;
}

module.exports = validate(config);

lib/parts.js

const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

exports.extractStyles = function(paths) {
    return {
        module: {
            loaders: [
                {
                    test: /\.less$/,
                    loader: ExtractTextPlugin.extract('style-loader', 'css-loader!less-loader'),
                    include: paths
                },
                {
                    test: /\.(png|woff|woff2|eot|ttf|svg)$/,
                    loader: 'url-loader',
                    query: {
                        limit: 10000,
                        name: './fonts/glyphicons-halflings-regular.[ext]'
                    }
                }
            ]
        },
        plugins: [
            new ExtractTextPlugin('./css/[name].[chunkhash].css')
        ]
    };
};

どんな助けでも感謝します。