Error in webpack build with extract-text-webpack-plugin
Hey @jeerbl, I am trying to use `webfonts-loader` in my webpack build with `extract-text-webpack-plugin` but I am getting an error:

<details>

<summary>webpack.base.conf.js</summary>

```js
'use strict';
const path = require('path');
const utils = require('./utils');
const config = require('../config');
const vueLoaderConfig = require('./vue-loader.conf');
const LodashModuleReplacementPlugin = require('lodash-webpack-plugin');

/**
 * Helper function to resolve paths relative to app root.
 *
 * @param {string} dir
 * @returns {string}
 */
function resolve(dir) {
    return path.join(__dirname, '..', dir);
}

module.exports = {
    entry: {
        app: './src/main.js'
    },
    output: {
        path: config.build.assetsRoot,
        filename: '[name].js',
        publicPath: process.env.NODE_ENV === 'production' ?
            config.build.assetsPublicPath : config.dev.assetsPublicPath
    },
    resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
            '@': resolve('src')
        }
    },
    module: {
        rules: [
            {
                test: /\.(js|vue)$/,
                loader: 'eslint-loader',
                enforce: 'pre',
                include: [resolve('src'), resolve('test')],
                options: {
                    formatter: require('eslint-friendly-formatter')
                }
            },
            {
                test: /\.vue$/,
                loader: 'vue-loader',
                options: vueLoaderConfig
            },
            {
                test: /\.js$/,
                loader: 'babel-loader',
                include: [resolve('src'), resolve('test')]
            },
            {
                test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
                loader: 'url-loader',
                options: {
                    limit: 10000,
                    name: utils.assetsPath('img/[name].[hash:7].[ext]')
                }
            },
            {
                test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
                loader: 'url-loader',
                options: {
                    limit: 10000,
                    name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
                }
            }
        ]
    },
    plugins: [
        // https://github.com/lodash/lodash-webpack-plugin
        new LodashModuleReplacementPlugin({
            // Iteratee shorthands for _.property, _.matches, & _.matchesProperty.
            shorthands: false,
            // Support “clone” methods & cloning source objects.
            cloning: false,
            // Support “curry” methods.
            currying: false,
            // Caches for methods like _.cloneDeep, _.isEqual, & _.uniq.
            caching: false,
            // Support objects in “Collection” methods.
            collections: false,
            // Support objects like buffers, maps, sets, symbols, typed arrays, etc.
            exotics: false,
            // Guards for host objects, sparse arrays, & other edge cases.
            guards: false,
            // Metadata to reduce wrapping of bound, curried, & partially applied functions.
            // (requires currying)
            metadata: false,
            // Support deburring letters.
            deburring: false,
            // Support Unicode symbols.
            unicode: false,
            // Components to support chain sequences.
            chaining: false,
            // 	Support _.memoize & memoization.
            memoizing: false,
            // Support for coercing values to integers, numbers, & strings.
            coercions: true,
            // 	Support “flatten” methods & flattening rest arguments.
            flattening: true,
            // Deep property path support for methods like _.get, _.has, & _.set.
            paths: true,
            // Argument placeholder support for “bind”, “curry”, & “partial” methods.
            // (requires currying)
            placeholders: false
        })
    ]
};

```

</details>

<br>

<details>

<summary>webpack.prod.conf.js</summary>

```js
'use strict';
const fs = require('fs');
const path = require('path');
const _ = require('lodash');
const utils = require('./utils');
const webpack = require('webpack');
const config = require('../config');
const merge = require('webpack-merge');
const baseWebpackConfig = require('./webpack.base.conf');
const WebpackStrip = require('strip-loader');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const OptimizeCSSPlugin = require('optimize-css-assets-webpack-plugin');
const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin');

const env = process.env.NODE_ENV === 'testing' ?
    require('../config/test.env') :
    config.build.env;

const appRoot = path.resolve(__dirname, '..');
const nodeModulesPath = path.join(appRoot, 'node_modules');

const webpackConfig = merge(baseWebpackConfig, {
    module: {
        rules: [
            ...utils.styleLoaders({
                sourceMap: config.build.productionSourceMap,
                extract: true
            }),
            {
                test: /\.font\.js$/,
                use: ExtractTextPlugin.extract({
                    use: [
                        'style-loader',
                        'css-loader',
                        'webfonts-loader'
                    ]})
            },
            { test: /\.js$/, loader: WebpackStrip.loader('debug') }
        ]
    },
    devtool: config.build.productionSourceMap ? '#source-map' : false,
    output: {
        path: config.build.assetsRoot,
        filename: utils.assetsPath('js/[name].[chunkhash].js'),
        chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
    },
    plugins: [
        // https://webpack.js.org/plugins/loader-options-plugin/
        new webpack.LoaderOptionsPlugin({
            minimize: true,
            debug: false,
            options: { context: appRoot }
        }),
        // http://vuejs.github.io/vue-loader/en/workflow/production.html
        new webpack.DefinePlugin({
            'process.env': env
        }),
        new webpack.NormalModuleReplacementPlugin(/debug/, path.join(__dirname, 'noop.js')),
        new webpack.optimize.UglifyJsPlugin({
            mangle: {
                toplevel: true,
                keep_fnames: false
            },
            sourceMap: true,
            compress: {
                properties: true,
                keep_fargs: false,
                pure_getters: true,
                collapse_vars: true,
                warnings: false,
                screw_ie8: true,
                sequences: true,
                dead_code: true,
                drop_debugger: true,
                comparisons: true,
                conditionals: true,
                evaluate: true,
                booleans: true,
                loops: true,
                unused: true,
                hoist_funs: true,
                if_return: true,
                join_vars: true,
                cascade: true,
                drop_console: true,
                pure_funcs: ['classCallCheck', '_classCallCheck', '_possibleConstructorReturn',
                    'Object.freeze', 'invariant', 'warning']
            },
            comments: false
        }),
        // extract css into its own file
        new ExtractTextPlugin({
            filename: utils.assetsPath('css/[name].[contenthash].css'),
            disable: false,
            allChunks: true
        }),
        // Compress extracted CSS. We are using this plugin so that possible
        // duplicated CSS from different components can be deduped.
        new OptimizeCSSPlugin({
            cssProcessorOptions: { safe: true }
        }),
        // generate dist index.html with correct asset hash for caching.
        // you can customize output by editing /index.html
        // see https://github.com/ampedandwired/html-webpack-plugin
        new HtmlWebpackPlugin({
            filename: process.env.NODE_ENV === 'testing' ?
                'index.html' : config.build.index,
            template: 'index.html',
            inject: true,
            minify: {
                removeComments: true,
                collapseWhitespace: true,
                removeAttributeQuotes: true
                // more options:
                // https://github.com/kangax/html-minifier#options-quick-reference
            },
            // necessary to consistently work with multiple chunks via CommonsChunkPlugin
            chunksSortMode: 'dependency',
            // TODO: minify service-worker-prod.js
            serviceWorkerLoader: `<script>${
                fs.readFileSync(
                    path.join(__dirname, './service-worker-prod.js'),
                    'utf-8'
                )
            }</script>`
        }),
        // split vendor js into its own file
        new webpack.optimize.CommonsChunkPlugin({
            name: 'vendor',
            // eslint-disable-next-line no-shadow, no-unused-vars
            minChunks(module, count) {
                // any required modules inside node_modules are extracted to vendor
                return (
                    module.resource &&
                    (/\.js$/).test(module.resource) &&
                    _.startsWith(module.resource, nodeModulesPath)
                );
            }
        }),
        // extract webpack runtime and module manifest to its own file in order to
        // prevent vendor hash from being updated whenever app bundle is updated
        new webpack.optimize.CommonsChunkPlugin({
            name: 'manifest',
            chunks: ['vendor']
        }),
        // copy custom static assets
        new CopyWebpackPlugin([
            {
                from: path.join(appRoot, 'static'),
                to: config.build.assetsSubDirectory,
                ignore: ['.*']
            }
        ]),
        // service worker caching
        new SWPrecacheWebpackPlugin({
            // TODO: Change this to appropriate cacheId
            cacheId: 'my-vue-app',
            filename: 'service-worker.js',
            staticFileGlobs: ['dist/**/*.{js,html,css}'],
            minify: true,
            stripPrefix: 'dist/'
        })
    ]
});

if (config.build.productionGzip) {
    const CompressionWebpackPlugin = require('compression-webpack-plugin');

    webpackConfig.plugins.push(
        new CompressionWebpackPlugin({
            asset: '[path].gz[query]',
            algorithm: 'gzip',
            test: new RegExp(
                `\\.(${
                    config.build.productionGzipExtensions.join('|')
                })$`
            ),
            threshold: 10240,
            minRatio: 0.8
        })
    );
}

if (config.build.bundleAnalyzerReport) {
    const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
    webpackConfig.plugins.push(new BundleAnalyzerPlugin());
}

module.exports = webpackConfig;

```

</details>

<br>

<details>

<summary>package.json</summary>

```js
{
  "scripts": {
    "dev": "node build/dev-server.js",
    "start": "node build/dev-server.js",
    "lint": "eslint --ext .js,.vue src build config test/unit/specs test/e2e/specs",
    "lint:fix": "npm run lint -- --fix",
    "precommit": "lint-staged",
    "cz": "git-cz",
    "cz:retry": "git-cz --retry",
    "commitmsg": "validate-commit-msg",
    "build": "node build/build.js",
    "unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
    "e2e": "node test/e2e/runner.js",
    "test": "npm run unit && npm run e2e"
  },
  "dependencies": {
    "date-fns": "^1.28.5",
    "debug": "^2.6.8",
    "es6-promise": "^4.1.1",
    "lodash": "^4.17.4",
    "qs": "^6.5.0",
    "vue": "^2.3.3",
    "vue-awesome-swiper": "^2.6.2",
    "vue-router": "^2.3.1",
    "vue2-google-maps": "^0.8.0",
    "whatwg-fetch": "^2.0.3"
  },
  "devDependencies": {
    "autoprefixer": "^7.1.2",
    "babel-core": "^6.22.1",
    "babel-eslint": "^7.1.1",
    "babel-loader": "^7.1.1",
    "babel-plugin-istanbul": "^4.1.1",
    "babel-plugin-lodash": "^3.2.11",
    "babel-plugin-syntax-dynamic-import": "^6.18.0",
    "babel-plugin-transform-runtime": "^6.22.0",
    "babel-preset-env": "^1.3.2",
    "babel-preset-stage-2": "^6.22.0",
    "babel-register": "^6.22.0",
    "chai": "^3.5.0",
    "chalk": "^2.0.1",
    "chromedriver": "^2.27.2",
    "commitizen": "^2.9.6",
    "connect-history-api-fallback": "^1.3.0",
    "copy-webpack-plugin": "^4.0.1",
    "cross-env": "^5.0.1",
    "cross-spawn": "^5.0.1",
    "css-loader": "^0.28.0",
    "cssnano": "^3.10.0",
    "cz-conventional-changelog": "^2.0.0",
    "dedent": "^0.7.0",
    "eslint": "^4.2.0",
    "eslint-friendly-formatter": "^3.0.0",
    "eslint-loader": "^1.7.1",
    "eslint-plugin-html": "^3.0.0",
    "eslint-plugin-lodash": "^2.4.3",
    "eslint-plugin-promise": "^3.5.0",
    "eventsource-polyfill": "^0.9.6",
    "express": "^4.14.1",
    "extract-text-webpack-plugin": "^3.0.0",
    "file-loader": "^0.11.1",
    "friendly-errors-webpack-plugin": "^1.6.1",
    "html-webpack-plugin": "^2.30.1",
    "http-proxy-middleware": "^0.17.3",
    "husky": "^0.14.3",
    "inject-loader": "^3.0.0",
    "karma": "^1.4.1",
    "karma-coverage": "^1.1.1",
    "karma-mocha": "^1.3.0",
    "karma-phantomjs-launcher": "^1.0.2",
    "karma-phantomjs-shim": "^1.4.0",
    "karma-sinon-chai": "^1.3.1",
    "karma-sourcemap-loader": "^0.3.7",
    "karma-spec-reporter": "^0.0.31",
    "karma-webpack": "^2.0.4",
    "lint-staged": "^4.0.1",
    "lodash-webpack-plugin": "^0.11.4",
    "lolex": "^1.5.2",
    "mocha": "^3.2.0",
    "nightwatch": "^0.9.12",
    "node-sass": "^4.5.3",
    "opn": "^5.1.0",
    "optimize-css-assets-webpack-plugin": "^2.0.0",
    "ora": "^1.2.0",
    "phantomjs-prebuilt": "^2.1.14",
    "rimraf": "^2.6.0",
    "sass-loader": "^6.0.6",
    "selenium-server": "^3.0.1",
    "semver": "^5.3.0",
    "shelljs": "^0.7.6",
    "sinon": "^2.1.0",
    "sinon-chai": "^2.8.0",
    "strip-loader": "^0.1.2",
    "style-loader": "^0.18.2",
    "sw-precache-webpack-plugin": "^0.11.4",
    "url-loader": "^0.5.8",
    "validate-commit-msg": "^2.12.2",
    "vue-loader": "^12.2.1",
    "vue-style-loader": "^3.0.1",
    "vue-template-compiler": "^2.3.3",
    "webfonts-loader": "^1.2.0",
    "webpack": "^3.5.6",
    "webpack-bundle-analyzer": "^2.9.0",
    "webpack-dev-middleware": "^1.12.0",
    "webpack-hot-middleware": "^2.19.1",
    "webpack-merge": "^4.1.0"
  },
  "engines": {
    "node": ">= 4.0.0",
    "npm": ">= 3.0.0"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ],
  "config": {
    "commitizen": {
      "path": "./node_modules/cz-conventional-changelog"
    }
  }
}

```

</details>

<br>

<details>

<summary>build.js</summary>

```js
'use strict';
require('./check-versions')();

process.env.NODE_ENV = 'production';

const ora = require('ora');
const rm = require('rimraf');
const path = require('path');
const chalk = require('chalk');
const dedent = require('dedent');
const webpack = require('webpack');
const config = require('../config');
const webpackConfig = require('./webpack.prod.conf');

const spinner = ora('building for production...');
spinner.start();

rm(path.join(config.build.assetsRoot, config.build.assetsSubDirectory), err => {
    if (err) throw err;
    webpack(webpackConfig, (webpackErr, stats) => {
        spinner.stop();
        if (webpackErr) throw webpackErr;
        process.stdout.write(`${stats.toString({
            colors: true,
            modules: false,
            children: false,
            chunks: false,
            chunkModules: false
        })}\n\n`);

        console.log(chalk.cyan('Build complete.\n'));
        console.log(chalk.yellow(dedent`
          Tip: built files are meant to be served over an HTTP server.
          Opening index.html over file:// won't work.
        `
        ));
    });
});

```

</details>

<br>

<details>

<summary>Stack trace</summary>

```
ERROR in ./src/core/icons.font.js
Module build failed: TypeError: text.forEach is not a function
    at my_prj_path\node_modules\extract-text-webpack-plugin\dist\loader.js:131:14
    at compile (my_prj_path\node_modules\webpack\lib\Compiler.js:304:11)
    at applyPluginsAsync.err (my_prj_path\node_modules\webpack\lib\Compiler.js:520:14)
    at next (my_prj_path\node_modules\tapable\lib\Tapable.js:202:11)
    at Compiler.<anonymous> (my_prj_path\node_modules\extract-text-webpack-plugin\dist\loader.js:108:7)
    at next (my_prj_path\node_modules\tapable\lib\Tapable.js:204:14)
    at Compiler.<anonymous> (my_prj_path\node_modules\webpack\lib\CachePlugin.js:62:5)
    at Compiler.applyPluginsAsyncSeries (my_prj_path\node_modules\tapable\lib\Tapable.js:206:13)
    at compilation.seal.err (my_prj_path\node_modules\webpack\lib\Compiler.js:517:11)
    at Compilation.applyPluginsAsyncSeries (my_prj_path\node_modules\tapable\lib\Tapable.js:195:46)
    at self.applyPluginsAsync.err (my_prj_path\node_modules\webpack\lib\Compilation.js:671:19)
    at Compilation.applyPluginsAsyncSeries (my_prj_path\node_modules\tapable\lib\Tapable.js:195:46)
    at self.applyPluginsAsync.err (my_prj_path\node_modules\webpack\lib\Compilation.js:662:11)
    at next (my_prj_path\node_modules\tapable\lib\Tapable.js:202:11)
    at Compilation.<anonymous> (my_prj_path\node_modules\uglifyjs-webpack-plugin\dist\index.js:244:6)
    at Compilation.applyPluginsAsyncSeries (my_prj_path\node_modules\tapable\lib\Tapable.js:206:13)
    at self.applyPluginsAsync.err (my_prj_path\node_modules\webpack\lib\Compilation.js:657:10)
    at Compilation.applyPluginsAsyncSeries (my_prj_path\node_modules\tapable\lib\Tapable.js:195:46)
    at sealPart2 (my_prj_path\node_modules\webpack\lib\Compilation.js:653:9)
    at Compilation.applyPluginsAsyncSeries (my_prj_path\node_modules\tapable\lib\Tapable.js:195:46)
    at Compilation.seal (my_prj_path\node_modules\webpack\lib\Compilation.js:596:8)
    at applyPluginsParallel.err (my_prj_path\node_modules\webpack\lib\Compiler.js:514:17)
 @ ./src/main.js 3:0-30
```

</details>

<br>

The project was created using this template - https://github.com/vuejs-templates/webpack. Apologies for the extremely verbose issue.