Webpack编译出错“Critical dependency: the request of a dependency is an expression”解决办法

Webpack编译出错“Critical dependency: the request of a dependency is an expression”解决办法

当使用webpack进行打包时，如果遇到如下的require语法，

var mx = require("hpargxm".split("").reverse().join(""));

编译将出错，会提示“Critical dependency: the request of a dependency is an expression”

这种require语法是正确的，但webpack不能处理require中的表达式，只能识别字符串，如：

var mx = require('mxgraph');

这是因为，webpack要判断require引用的文件，并读取和合并文件内容。由于webpack无法执行js代码，所以，当require的内容是表达式时，webpack无法正确获取文件信息。

这属于webpack无奈的bug，解决办法是需要webpack具备执行js代码能力，比如可以内置一个javascript小引擎，以便解析表达式内容。

在实际的编程中，如果遇到这种问题，只需修改require中的表达式为字符串即可。

另外，当进行JS代码混淆时，也常会对require中的字符串内容进行加密，也会引发webpack的这个bug，解决办法是：规避指定的字符，比如使用JShaman进行JS代码混淆时，可以配置“保留字”，对指定的字符串不进行加密。