使用Grunt和Webpack的結構

Question

我有一個典型的Webpack設置，如下所示：

// webpack.config.js    
var ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
    entry: "./entry.js",
    output: {
        path: "./build",
        filename: "bundle.js"
    },
    module: {
        loaders: [
                { test: /\.scss$/, loader: ExtractTextPlugin.extract('css!sass')
            }
        ]
    },
    plugins: [
        new ExtractTextPlugin('style.css', {
            allChunks: true
        })
    ]
};

但是我仍然想使用Grunt來運行我的構建，所以我試圖從Grunt任務調用Webpack，因此將所有設置移到Grunt中，如下所示：

// webpack.js - This is a grunt task being loaded into gruntfile.js    
module.exports = {
    entry: "./entry.js",
    output: {
        path: "./build",
        filename: "bundle.js"
    },
    module: {
        loaders: [
                { test: /\.scss$/, loader: ExtractTextPlugin.extract('css!sass') }
        ]
    },
    plugins: [
        new ExtractTextPlugin('style.css', {
            allChunks: true
        })
    ]
    };

現在明顯的問題是，當我運行grunt build時，它無法識別對ExtractTextPlugin的引用。 那么，現在我該在哪里聲明不能使用webpack.config？

如果我要解決所有這些錯誤，請讓我知道，因為我只是在學習Webpack。

Answer 1

您只需要自己要求它：

var ExtractTextPlugin = require("extract-text-webpack-plugin");