关于webpack提取scss并转换为CSS打包压缩？

[怀念不能]

1. 使用Webpack^4.6.0 + React + React-router(配合react-loadable)按需加载，在生产环境打包编译时压缩CSS报错，并且多次打包有时候可以完成，但是打包出来的CSS未压缩，并且有些CSS文件里打包的好像是js代码，通过服务器运行有些样式好像并没有生效？
2. 关键webpack配置

const extractCSS = new extractTextPlugin({
			filename: 'css/[name].[md5:contenthash:hex:8].css',
			allChunks: true
		});
const extractSCSS = new extractTextPlugin({
			filename: 'css/[name].[md5:contenthash:hex:8].css',
			allChunks: true
		});
……………………
plugins: [
		// 提取CSS文件
		extractCSS,
		extractSCSS,

		// css文件压缩
		new optimizeCssPlugin({
			assetNameRegExp: /\.css$/g,
	        cssProcessor: require('cssnano'),
	        cssProcessorOptions: { discardComments: { removeAll: true } },
	        canPrint: true
		}),
	],

	module: {
		rules: [
			{
				test: /\.(js|jsx)$/,
				use: [
					'babel-loader',
				],
				exclude: path.resolve(__dirname,' ../../node_modules'),
			},
			{
			    test: /\.scss$/,
			    use: extractSCSS.extract({
			    use: [
			    	'css-loader',
			    	'postcss-loader',
			    	'sass-loader'
			    	
			    ],
			    fallback: "style-loader",
				}),
				include: path.resolve(__dirname,' ../../client')
			},
			{
				test: /\.css$/,
				use: extractCSS.extract({
					use: ['css-loader','postcss-loader'],
					fallback: "style-loader",
				}),
				include:[
					path.resolve(__dirname,' ../../client'),
					path.join(__dirname, '../../node_modules/antd')
				]
			},
			{
				test: /\.(png|jpg|jpeg|png|gif|woff|svg|eot|ttf)/,
				loader: 'url-loader?limit=8192&name=[name].[hash:8].[ext]&publicPath=' + webpackFiles.resourcePrefix + '&outputPath='+webpackFiles.resource+'/'
			},
			{
				test: /\.swf$/,
				loader: 'file?name=js/[name].[ext]'
			},
		]
	}

});

post.config.js

module.exports = {
  plugins: [
    require('autoprefixer'),
  ]
};

.babelrc

{
	"presets": [

		["es2015",{"loose":true,"modules": false}],

		"react",
	 ],

	"env": {
		"development": {
			"presets": ["stage-2","react-hmre"]
		},
		"production": {
			"presets": ["stage-2"],
		}
	},
	
	"plugins": [
		["import", {"libraryName": "antd", "libraryDirectory": "es", "style": "css"}],
		
	]
}

3. 路由按需加载

/*---------按需加载组件---------------*/
const Index = Loadable({
  loader: () => import('../views/index'),
  loading: loadingComponent
});

const Detail= Loadable({
  loader: () => import('../views/detail'),
  loading: loadingComponent
});

const Login= Loadable({
  loader: () => import('../views/login'),
  loading: loadingComponent
});
const Product= Loadable({
  loader: () => import('../views/product'),
  loading: loadingComponent
});
const Regist= Loadable({
  loader: () => import('../views/regist/regist'),
  loading: loadingComponent
});
const Seller= Loadable({
  loader: () => import('../views/userInfo/user'),
  loading: loadingComponent
});
const UserSet= Loadable({
  loader: () => import('../views/userSet'),
  loading: loadingComponent
});

4.报错截图

5.另外使用react-loadable按需加载js打包正常，命名可以自己定义吗？**求解………………**