absolutepathleaks最近项目发布审核时，发现输出的前端代码有泄露：绝对路径泄露。解决方案1.检查webpack打包是否正确设置了process.env.NODE_ENV。//在webpack的plugins配置中放置如下代码newwebpack.DefinePlugin({'process.env':{NODE_ENV:'"production"'}})2.执行process.env.NODE_ENV="beforerunningwebpackproduction"//一般项目都会有build.js来运行webpak，从build.js中可以找到类似下面的代码process.env.NODE_ENV="production"//添加这行代码webpack(webpackConfig,function(err,stats){spinner.stop()if(err)throwerrprocess.stdout.write(stats.toString({colors:true,modules:false,children:false,chunks:false,chunkModules:false})+'\n\n')})3.直接修改vue-loader的源码硬编码到生产环境中。（太暴力，不推荐）3.1将node_modules文件夹下的“vue-loader”复制到源码根目录下。3.2修改webpack配置中vue-loader的路径：module:{rules:[{test:/\.vue$/,//loader:'vue-loader',//修改前的loader:path.resolve('./vue-loader/index.js'),//修改3.3修改vue-loader源码./vue-loader/lib/loader.js,生产环境hardcoded://varisProduction=this.minimize||过程。env.NODE_ENV==='production'//修改前，varisProduction=true;//修改后，问题原理1.源码分析1.1从输出的源码来看，代码已经压缩，应该按照生产环境的配置起来了。1.2压缩后的源码很难发现问题，所以先取消压缩。//分析下面的代码，初始定位是vue-loader解析css时输出的代码varComponent=__webpack_require__(9)(/*script*/__webpack_require__(1828),/*template*/__webpack_require__(1830),/*scopeId*/null,/*cssModules*/null)Component.options.__file="C:\\Users\\xxxx\\col.vue"if(Component.esModule&&Object.keys(Component.esModule).some(function(key){returnkey!=="default"&&key!=="__esModule"})){console.error("namedexportsarenotsupportedin*.vuefiles.")}if(Component.options.functional){console.error("[vue-loader]col.vue:functionalcomponentsarenotsupportedwithtemplates,theyshoulduserenderfunctions.")}1.3Checkvue-loadersourcecode//只能分析源码在生产环境中原则上输出这些代码。理论上，如果设置了process.env.NODE_ENV，则不应输出这些代码。初步判断是process.env.NODE_ENV没有设置或者没有作用。varisProduction=this.minimize||process.env.NODE_ENV==='production'//...省略多行//仅开发代码if(!isProduction){//在开发输出中添加文件名+='Component.options.__file='+JSON.stringify(filePath)+'\n'//检查命名导出输出+='if(Component.esModule&&Object.keys(Component.esModule).some(function(key){'+'returnkey!=="default"&&key!=="__esModule"'+'})){'+'console.error("namedexportsarenotsupportedin*.vuefiles.")'+'}\n'//检查功能组件与模板一起使用if(template){output+='if(Component.options.functional){'+'console.error("'+'[vue-loader]'+fileName+':功能组件不是'+'有模板支持，应该使用render函数。'+'")}\n'}}1.4硬编码生产环境，编译输出（使用方案3）从输出结果来看，这次打包已经满足打包要求，并且可以解决漏洞，但没有解决本质问题。为什么process.env.NODE_ENV配置不起作用？2.初步解决方案既然DefinePlugin配置process.env.NODE_ENV不起作用，那就通过写代码来配置。（如前所述：解决方案2Executeprocess.env.NODE_ENV="beforerunningwebpackproduction"）3.为什么DefinePlugin配置process.env.NODE_ENV不起作用？通过生产代码的输出可以看出DefinePlugin已经起作用了，只是在执行vue-loader之前还没有运行。3、最后的问题是如何通过代码跟踪让DefinePlugin的执行顺序优先于vue-loader的执行顺序。这应该是webpack2的天然bug。为了避免此类问题，3.1推荐构建升级webpack4+，直接使用mode配置Production环境。3.2使用vue-cli构建项目（推荐），可以省去很多webpack的配置傻瓜式使用，让你不用花太多时间在webpack配置上。3.2如果不想改动太多，可以参考方案2
