在项目打包过程中，突然报如下错误：
Vue npm run build 错误 (node:7852) UnhandledPromiseRejectionWarning: CssSyntaxError:xxxx.
但是在执行 npm run dev过程中，并未错误或告警信息。
经过一番网络搜索找到了一个解决方案：
打开webpack.prod.conf.js
注释掉以下配置代码
new OptimizeCSSPlugin({
cssProcessorOptions: config.build.productionSourceMap
? { safe: true, map: { inline: false } }
: { safe: true }
}),
有关OptimizeCSSPlugin组件的作用，可参考博文《Vue进阶（五十三）：vue-cli脚手架build目录中的webpack.prod.conf.js配置文件》。
通过注释掉该段代码，项目可正常编译。
不过，OptimizeCSSPlugin组件的作用主要是实现压缩css代码的，还能去掉extract-text-webpack-plugin插件抽离文件产生的重复代码，因为同一个css可能在多个模块中出现所以会导致重复代码。
由此可知，通过使用以上组件，可压缩编译后的CSS项目样式文件。故该组件还是需要使用的。
通过查看错误提示信息，可知是theme-colors.css文件编译报错，由于该文件是由主体色切换生成的样式文件，通过查看处理逻辑，怀疑是颜色替换过程中报错，通过查看替换色使用地方，发现存在循环处理过程中使用同种主体色的情形。
通过将该颜色码值修改为与替换主体色不一致，项目编译成功。
问题总结：在循环使用项目主体色过程中，生成压缩后的颜色样式存在问题，具体解决措施暂不考虑。
OptimizeCSSPlugin组件部分还是不应该注掉，虽然可以解决问题，但并不是最优解。还应结合具体的错误原因，找到根本原因，然后解决。有的童鞋遇到的错误原因如下：
来源：oschina
链接：https://my.oschina.net/u/4367923/blog/3234452