一、extrack-tex-webpack-plugin作用：
為了抽離css樣式,防止將樣式打包在js中引起頁面樣式載入錯亂的現象
二、使用
1、

npm install --save-dev extract-webpack-plugin

2、webpack.production.config.js中

const webpack=require("webpack");
//...
const ExtractTextPlugin=require("extract-text-webpack-plugin");

module.exports={
    devtool:'null',//注意，這能大大壓縮我們的打包程式碼
    entry:'./src/main.js'
 
,//唯一入口檔案，__dirname是node.js中的一個全域性變數，它指向當前執行指令碼所在目錄
    output:{
        filename:"bundle-[hash].js",//打包後輸出的檔案的檔名
        path:__dirname+'/build'//打包後的檔案存放的地方
    },
    devServer:{
       ../
    },
    module: {
      //...
    },
    plugins: [
       //...
       new ExtractTextPlugin('style.css')
    ],
};
 

報錯：

錯誤出現原因：

extract-text-webpack-plugin還不能支援webpack4.0.0以上的版本。

三、解決

npm install --save-dev extract-webpack-plugin@next

再次執行，就ok啦