sourcemap与webpack-sourcemap的实现

sourcemap与webpack-sourcemap的实现

  1. vlq和Base64 vlq
  2. sourcemap
  3. //# sourceMappingURL//# sourceUrl
  4. sourcemap in webpack

before

webkit-sourcemap初步介绍:http://www.html5rocks.com/en/tutorials/developertools/sourcemaps/#toc-sourceurl,介绍了sourcemap的基本实现,包括sourcemap的格式、编码以及sourceMapURL、sourceURL、和profiles里面的displayName(最新版chrome好像已经不支持了。)

google关于定义sourcemap v3的docs https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit?hl=en_US&pli=1&pli=1

正常来说通过sourceMapURL指定的sources中的路径从服务器找源文件。如果无法定位就是用sourcesContent对应的内容。如果是从sourcesContent获取的源码内容,那么这个source-map文件就是一个完全自包含的source-map(包含映射关系,包含源文件内容)。

完全自包含的source-map文件常用dataUrl的形式,这样浏览器就能从编译之后的js文件(末行是source-map的dataUrl)中完全解析出源文件,并不依赖其他文件。

1. vlq与base64 vlq:variable length quantity

  1. https://en.wikipedia.org/wiki/Variable-length_quantity
  2. https://blogs.msdn.microsoft.com/davidni/2016/03/14/source-maps-under-the-hood-vlq-base64-and-yoda/
  3. http://blog.allenm.me/2012/12/base64-vlq-encoding/
  4. 在线base64vlq:http://murzwin.com/base64vlq.html

上面几篇文章讲的比较详细,总结一下:

  1. vlq是用8位字节码来表示一个数字的。base64vlq是使用base64原有的6bit来表示数字。
  2. 以base64vlq为例,每一位字节的二进制第一位表示是否continue,如果1表示下一位字节和当前字节是表示一个数字,如果是0表示该一个字节就可表示一个数字;表示一个数字的一组字节中第一个字节的二进制最后一位表示正负,1表示在负,0表示正;

以456为例展示一下从数字转换为base64vlq的过程:

  1. 456的二进制为:111001000
  2. 正数在最后一个补0,变为1110010000
  3. 5位分组,分为11100 10000
  4. 从低位到高位转换:1表示继续,0表示结束:结果为110000 011100
  5. 分别对应base64为W和C
  6. 结果就是WC

2. sourcemap使用base64vql进行位置定位

在sourcemap文件里:

{
    version : 3, // soucemap的版本
    file: "out.js", // 对应的输出文件
    sourceRoot : "",
    sources: ["foo.js", "bar.js"], // 对应的源文件。
    sourcesContent: [null, null], // 如果无法从服务器上定位sources中的文件,则从这个属性读取,如果从这个属性读取,该sourcemap是自包含的sourcemap。
    names: ["src", "maps", "are", "fun"], // 原来的变量标识
    mappings: "AAgBC,SAAQ,CAAEA" // 位置对应表
}

关于sourcemap的属性可以从v3docs里查看:

  1. 可以结合sources和sourcesContent生成自包含的sourcemap文件。例如webpack就是使用sources: ["webpack://app.vue"]类似的假地址使chrome无法定位源文件,转而使用sourcesContent,最终在浏览器sources面板有一个特定的目录webpack://

其中mappings用;表示分行,用,表示一个位置,一个位置的格式分5个:

  - 第一位,表示这个位置在(转换后的代码的)的第几列。
  - 第二位,表示这个位置属于sources属性中的哪一个文件。
  - 第三位,表示这个位置属于转换前代码的第几行。
  - 第四位,表示这个位置属于转换前代码的第几列。
  - 第五位,表示这个位置属于names属性中的哪一个变量。(非必须)

3. //# sourceMappingURL//# sourceUrl

  1. //# sourceMappingURL=/path/to/file.js.map或者//# sourceMappingURL=dataURL:base64使用在文件的最后-行,指定map文件,可以使url,也可以是dataURL;
  2. //# sourceUrl=webpack:///./components/common-header.vue是用在eval语句中的最后,当代码是在eval里执行的时候,可以在最后加上sourceURL,对eval里面的代码命名,然后我们就可以在dev-tools直接对命名后的eval进行调试。如demo
  3. 在eval执行的代码最后可以使用sourceURL对eval的代码块命名,也可以使用sourceMapURL(path/dataURL)找eval里面的代码块与源文件的对应关系

4. sourcemap in webpack

在webpack sourcemap里面有很多种配置,具体可以看文档。这里介绍一下用过的几种:

  1. eval:loader转译之后代码都在eval里面执行,在eval后面添加sourceURL命名eval,并且调试对应的代码(在浏览器展示中)都是loader编译之后的代码。
  2. source-map:loader转译之后代码都在webpack_require闭包里面执行,非eval,在最后添加sourceMapURL=path;在浏览器展示中对应的是源文件(里面的mapping应该是webpack和loader的结合)。demo中使用的是webpack server,没在本地库见到生成的commons.js和commons.js.map,应该都在webpack server代理的内存里。(通过webpack命令跑出来的是有commons.js和commons.js.map)。

    commons.js.map是一个完全自包含的source-map文件,在sources与sourcesContent里定义了所有源文件的内容,感觉源文件与loader编译后(在浏览器执行的代码)并不是很严格的一一映射。(比如babel转码添加的pollyfill的代码在源文件中并没有映射)

    {
        "version": 3,
        "sources": ["webpack:///account.js", "webpack:///./pages/account/main.js", "webpack:///./components/common-lr-router.vue?7dbb*", "webpack:///./components/common-lr-router.vue?ca26*", "webpack:///./components/common-lr-router.vue?a5be", "webpack:///./components/common-lr-router.vue?f2d1*", "webpack:///line-selector.vue", "webpack:///addInternal.vue", "webpack:///app.vue?a737", "webpack:///./components/form/line-selector.vue?3f48", "webpack:///./pages/account/addInternal.vue?1145", "webpack:///./pages/account/app.vue?4958", "webpack:///./components/form/line-selector.vue?6234", "webpack:///./pages/account/addInternal.vue?4b7d", "webpack:///./pages/account/app.vue?0577", "webpack:///./components/form/line-selector.vue", "webpack:///./pages/account/addInternal.vue", "webpack:///./pages/account/app.vue", "webpack:///./components/form/line-selector.vue?639a", "webpack:///./pages/account/addInternal.vue?94e5", "webpack:///./pages/account/app.vue?c5dc"],
        "names": ["webpackJsonp", "0", "module", "exports", "__webpack_require__", "_interopRequireDefault", "obj", "__esModule", "default", "_vue", "_vue2", "_app", "_app2", "_store", "_store2", "_vueRouter", "_vueRouter2", "_addInternal", "_addInternal2", "$", "use", "router", "map", "*", "component", "/addInternal", "redirect", "start", "store", "components", "App", "66", "Object", "defineProperty", "value", "data", "111", "push", "id", "version", "sources", "names", "mappings", "file", "sourcesContent", "sourceRoot", "118", "124", "__vue_script__", "__vue_template__", "options", "template", "126", "content", "locals", "149", "_lineBase", "_lineBase2", "props", "necessary", "display", "Array", "ready", "this", "$els", "selector", "firstElementChild", "LineBase", "methods", "getValidate", "getValue", "153", "_lineSelector", "_lineSelector2", "_lineInput", "_lineInput2", "_passwordInputs", "_passwordInputs2", "_phoneInputs", "_phoneInputs2", "_actions", "_notify", "_notify2", "vuex", "actions", "addUser", "submitDisable", "roleOptions", "text", "LineSelector", "FormInput", "PasswordInputs", "PhoneInputs", "submit", "sendEmail", "_this", "validate", "forEach", "tag", "$refs", "setTimeout", "phone", "role", "username", "contact", "email", "success", "154", "_commonHeader", "_commonHeader2", "_commonLrRouter", "_commonLrRouter2", "getUser", "commonHeader", "commonLrRouter", "183", "186", "187", "214", "218", "219", "244", "245", "246", "271", "274", "275"],
        "mappings": "AAAAA,cAAc,IAERC,EACA,SAASC,EAAQC,EAASC,GAE/B,YAsBA,SAASC,GAAuBC,GAAO,MAAOA,IAAOA,EAAIC,WAAaD,GAAQE,UAASF,GCvBxF,GAAAG,GAAAL,EAAA,GDKKM,EAAQL,EAAuBI,GCJpCE,EAAAP,EAAA,KDQKQ,EAAQP,EAAuBM,GCPpCE,EAAAT,EAAA,IDWKU,EAAUT,EAAuBQ,GCVtCE,EAAAX,EAAA,IDcKY,EAAcX,EAAuBU,GCb1CE,EAAAb,EAAA,KDiBKc,EAAgBb,EAAuBY,ECf5CE,GAAE,WACET,aAAIU,IAAJJ,aACA,IAAIK,GAAS,GAAAL,aACbK,GAAOC,KACHC,KACIC,UAAAN,cAEJO,gBACID,UAAAN,gBAGRG,EAAOK,UACHH,IAAK,iBAETF,EAAOM,OACHC,MAAAd,aACAe,YACIC,IAAAlB,eAEL,WDwBDmB,GACA,SAAS7B,EAAQC,GAEtB,YAEA6B,QAAOC,eAAe9B,EAAS,cAC3B+B,OAAO,IAEX/B,cACIgC,KAAM,WACF,YAMHC,IACA,SAASlC,EAAQC,EAASC,GEtEhCD,EAAAD,EAAAC,QAAAC,EAAA,KAKAD,EAAAkC,MAAAnC,EAAAoC,GAAA,0nCAAipC,IAAQC,QAAA,EAAAC,SAAA,sCAAAC,SAAAC,SAAA,yYAAAC,KAAA,uBAAAC,gBAAA,+nCAAwoDC,WAAA,iBF+E3xFC,IACA,SAAS5C,EAAQC,GGrFvBD,EAAAC,QAAA,uIH2FM4C,IACA,SAAS7C,EAAQC,EAASC,GI5FhC,GAAA4C,GAAAC,CACA7C,GAAA,KACA4C,EAAA5C,EAAA,IACA6C,EAAA7C,EAAA,KACAF,EAAAC,QAAA6C,MACA9C,EAAAC,QAAAI,aAAAL,EAAAC,QAAAD,EAAAC,QAAAD,YACA+C,KACA,kBAAA/C,GAAAC,QAAAD,EAAAC,QAAA+C,UAAAhD,EAAAC,QAAA+C,YAA+FhD,EAAAC,SAAAgD,SAAAF,IJoGzFG,IACA,SAASlD,EAAQC,EAASC,GKzGhC,GAAAiD,GAAAjD,EAAA,IACA,iBAAAiD,SAAAnD,EAAAoC,GAAAe,EAAA,KAEAjD,GAAA,GAAAiD,KACAA,GAAAC,SAAApD,EAAAC,QAAAkD,EAAAC,SL+HMC,IACA,SAASrD,EAAQC,EAASC,GAE/B,YAUA,SAASC,GAAuBC,GAAO,MAAOA,IAAOA,EAAIC,WAAaD,GAAQE,UAASF,GARvF0B,OAAOC,eAAe9B,EAAS,cAC9B+B,OAAO,GMxHT,IAAAsB,GAAApD,EAAA,IN6HKqD,EAAapD,EAAuBmD,EAIxCrD,eACCuD,OACCC,WACCnD,WM/HJ,GNiIGoD,SACCpD,UM/HJ,KNiIG0C,QM/HHW,ONiIE1B,KAAM,WACL,OACCD,MM/HJ,KNkIE4B,MAAO,WACNC,KAAK7B,MAAQ6B,KAAKC,KAAKC,SAASC,kBMhInChC,ONmIEL,YM/HFsC,SAAAV,cNkIEW,SACCC,YAAa,WACZ,OMjIJ,GNmIGC,SAAU,WACT,MAAOP,MMjIX7B,UNwIMqC,IACA,SAASrE,EAAQC,EAASC,GAE/B,YAoCA,SAASC,GAAuBC,GAAO,MAAOA,IAAOA,EAAIC,WAAaD,GAAQE,UAASF,GAlCvF0B,OAAOC,eAAe9B,EAAS,cAC3B+B,OAAO,GOhJZ,IAAAzB,GAAAL,EAAA,GACAoE,GPoJanE,EAAuBI,GOpJpCL,EAAA,MPwJKqE,EAAiBpE,EAAuBmE,GOvJ7CE,EAAAtE,EAAA,IP2JKuE,EAActE,EAAuBqE,GO1J1CE,EAAAxE,EAAA,IP8JKyE,EAAmBxE,EAAuBuE,GO7J/CE,EAAA1E,EAAA,IPiKK2E,EAAgB1E,EAAuByE,GOhK5CtB,EAAApD,EAAA,IPoKKqD,EAAapD,EAAuBmD,GOjKzCwB,EAAA5E,EAAA,GAGA6E,EAAA7E,EAAA,IPoKK8E,EAAW7E,EAAuB4E,EAItC9E,eACIgF,MACIC,SOpKTC,QAAAL,EAAAK,UPwKKlD,KAAM,WACF,OACImD,eOvKb,EPwKaC,cACIrD,MOtKjB,IPuKiBsD,KOrKjB,QPuKiBtD,MOrKjB,IPsKiBsD,KOpKjB,UPsKiBtD,MOpKjB,IPqKiBsD,KOjKjB,UPsKK3D,YOnKL4D,aAAAhB,aACAiB,UAAAf,aACAgB,eAAAd,aACAe,YAAAb,aAEAZ,SAAAV,cPqKKK,MAAO,aAEPM,SACIyB,OAAQ,SAAgBC,GOnKjC,GAAAC,GAAAhC,IPsKa,KAAIA,KAAKuB,cAAT,CAGA,GAAIU,IOrKjB,CP8Ka,KARC,OAAQ,WAAY,UAAW,SAASC,QAAQ,SAAUC,GAClDH,EAAMI,MAAMD,GAAK7B,cAGlB0B,EAAMG,GAAOH,EAAMI,MAAMD,GOrK9C5B,WPmKqB0B,GOrKrB,KP2KkBA,EACD,OOrKjB,CPwKajC,MAAKuB,eOrKlB,EPsKac,WAAW,WACPL,EAAMT,eOrKvB,GAEA,MPsKavB,KAAKoC,MAAME,MAAMhC,YAAY,SAAUlC,GACnC4D,EAAMM,MAAQN,EAAMI,MAAME,MOrK3C/B,WPsKiByB,EAAMV,QAAQU,EAAMO,KAAMP,EAAMQ,SAAUR,EAAMS,QAAST,EAAMM,MAAON,EAAMU,MAAOX,EAAW,SAAU3D,GACpG+C,aAAiBwB,QAAQ,SOrK9C,cP8KMC,IACA,SAASzG,EAAQC,EAASC,GAE/B,YAgBA,SAASC,GAAuBC,GAAO,MAAOA,IAAOA,EAAIC,WAAaD,GAAQE,UAASF,GAdvF0B,OAAOC,eAAe9B,EAAS,cAC3B+B,OAAO,GQ/RZ,IAAA0E,GAAAxG,EAAA,IRoSKyG,EAAiBxG,EAAuBuG,GQnS7CE,EAAA1G,EAAA,KRuSK2G,EAAmB1G,EAAuByG,GQlS/C9B,EAAA5E,EAAA,ERwSCD,eACIgF,MACIC,SQpST4B,QAAAhC,EAAAgC,URwSK7E,KAAM,WACF,UAGJN,YQvSLoF,aAAAJ,aAEAK,eAAAH,cRySKjD,MAAO,WACHC,KQxSTiD,WR2SK5C,aAKC+C,IACA,SAASjH,EAAQC,EAASC,GSjVhCD,EAAAD,EAAAC,QAAAC,EAAA,KAKAD,EAAAkC,MAAAnC,EAAAoC,GAAA,yGAAgI,IAAQC,QAAA,EAAAC,SAAA,wCAAAC,SAAAC,SAAA,kDAAAC,KAAA,oBAAAC,gBAAA,0GAA2RC,WAAA,iBT0V7ZuE,IACA,SAASlH,EAAQC,EAASC,GUhWhCD,EAAAD,EAAAC,QAAAC,EAAA,KAKAD,EAAAkC,MAAAnC,EAAAoC,GAAA,sXAA6Y,IAAQC,QAAA,EAAAC,SAAA,oCAAAC,SAAAC,SAAA,8IAAAC,KAAA,kBAAAC,gBAAA,yXAAkoBC,WAAA,iBVyWjhCwE,IACA,SAASnH,EAAQC,EAASC,GW/WhCD,EAAAD,EAAAC,QAAAC,EAAA,KAKAD,EAAAkC,MAAAnC,EAAAoC,GAAA,OAAkCC,QAAA,EAAAC,WAAAC,SAAAC,SAAA,GAAAC,KAAA,UAAAE,WAAA,iBXwX5ByE,IACA,SAASpH,EAAQC,GY9XvBD,EAAAC,QAAA,iPZoYMoH,IACA,SAASrH,EAAQC,GarYvBD,EAAAC,QAAA,6+Bb2YMqH,IACA,SAAStH,EAAQC,Gc5YvBD,EAAAC,QAAA,4HdkZMsH,IACA,SAASvH,EAAQC,EAASC,GenZhC,GAAA4C,GAAAC,CACA7C,GAAA,KACA4C,EAAA5C,EAAA,KACA6C,EAAA7C,EAAA,KACAF,EAAAC,QAAA6C,MACA9C,EAAAC,QAAAI,aAAAL,EAAAC,QAAAD,EAAAC,QAAAD,YACA+C,KACA,kBAAA/C,GAAAC,QAAAD,EAAAC,QAAA+C,UAAAhD,EAAAC,QAAA+C,YAA+FhD,EAAAC,SAAAgD,SAAAF,If2ZzFyE,IACA,SAASxH,EAAQC,EAASC,GgBnahC,GAAA4C,GAAAC,CACA7C,GAAA,KACA4C,EAAA5C,EAAA,KACA6C,EAAA7C,EAAA,KACAF,EAAAC,QAAA6C,MACA9C,EAAAC,QAAAI,aAAAL,EAAAC,QAAAD,EAAAC,QAAAD,YACA+C,KACA,kBAAA/C,GAAAC,QAAAD,EAAAC,QAAA+C,UAAAhD,EAAAC,QAAA+C,YAA+FhD,EAAAC,SAAAgD,SAAAF,IhB2azF0E,IACA,SAASzH,EAAQC,EAASC,GiBnbhC,GAAA4C,GAAAC,CACA7C,GAAA,KACA4C,EAAA5C,EAAA,KACA6C,EAAA7C,EAAA,KACAF,EAAAC,QAAA6C,MACA9C,EAAAC,QAAAI,aAAAL,EAAAC,QAAAD,EAAAC,QAAAD,YACA+C,KACA,kBAAA/C,GAAAC,QAAAD,EAAAC,QAAA+C,UAAAhD,EAAAC,QAAA+C,YAA+FhD,EAAAC,SAAAgD,SAAAF,IjB2bzF2E,IACA,SAAS1H,EAAQC,EAASC,GkBhchC,GAAAiD,GAAAjD,EAAA,IACA,iBAAAiD,SAAAnD,EAAAoC,GAAAe,EAAA,KAEAjD,GAAA,GAAAiD,KACAA,GAAAC,SAAApD,EAAAC,QAAAkD,EAAAC,SlBsdMuE,IACA,SAAS3H,EAAQC,EAASC,GmB3dhC,GAAAiD,GAAAjD,EAAA,IACA,iBAAAiD,SAAAnD,EAAAoC,GAAAe,EAAA,KAEAjD,GAAA,GAAAiD,KACAA,GAAAC,SAAApD,EAAAC,QAAAkD,EAAAC,SnBifMwE,IACA,SAAS5H,EAAQC,EAASC,GoBtfhC,GAAAiD,GAAAjD,EAAA,IACA,iBAAAiD,SAAAnD,EAAAoC,GAAAe,EAAA,KAEAjD,GAAA,GAAAiD,KACAA,GAAAC,SAAApD,EAAAC,QAAAkD,EAAAC",
        "file": "account.js",
        "sourcesContent": ["webpackJsonp([5],{\n\n/***/ 0:\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\t\n\tvar _vue = __webpack_require__(3);\n\t\n\tvar _vue2 = _interopRequireDefault(_vue);\n\t\n\tvar _app = __webpack_require__(246);\n\t\n\tvar _app2 = _interopRequireDefault(_app);\n\t\n\tvar _store = __webpack_require__(18);\n\t\n\tvar _store2 = _interopRequireDefault(_store);\n\t\n\tvar _vueRouter = __webpack_require__(63);\n\t\n\tvar _vueRouter2 = _interopRequireDefault(_vueRouter);\n\t\n\tvar _addInternal = __webpack_require__(245);\n\t\n\tvar _addInternal2 = _interopRequireDefault(_addInternal);\n\t\n\tfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\t\n\t$(function () {\n\t    _vue2.default.use(_vueRouter2.default);\n\t    var router = new _vueRouter2.default();\n\t    router.map({\n\t        '*': {\n\t            component: _addInternal2.default\n\t        },\n\t        '/addInternal': {\n\t            component: _addInternal2.default\n\t        }\n\t    });\n\t    router.redirect({\n\t        '*': '/addInternal'\n\t    });\n\t    router.start({\n\t        store: _store2.default,\n\t        components: {\n\t            App: _app2.default\n\t        }\n\t    }, '#app');\n\t});\n\n/***/ },\n\n/***/ 66:\n/***/ function(module, exports) {\n\n\t\"use strict\";\n\t\n\tObject.defineProperty(exports, \"__esModule\", {\n\t    value: true\n\t});\n\texports.default = {\n\t    data: function data() {\n\t        return {};\n\t    }\n\t};\n\n/***/ },\n\n/***/ 111:\n/***/ function(module, exports, __webpack_require__) {\n\n\texports = module.exports = __webpack_require__(1)();\n\t// imports\n\t\n\t\n\t// module\n\texports.push([module.id, \"body{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.lr-router{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;position:relative}.lr-router .left-panel{padding-top:0;position:absolute;top:0;left:0;width:120px;height:100%;box-shadow:2px 0 2px rgba(0,0,0,.05)}.lr-router .left-panel a{position:relative;display:block;margin-right:-3px;text-align:center;line-height:40px}.lr-router .left-panel a:first-of-type.v-link-active{box-shadow:4px 0 0 #fff,inset 0 -2px 2px rgba(0,0,0,.05)}.lr-router .left-panel a.v-link-active{box-shadow:4px 0 0 #fff,inset 0 2px 2px rgba(0,0,0,.05),inset 0 -2px 2px rgba(0,0,0,.05);font-weight:bolder}.lr-router .left-panel a.v-link-active:before{content:'';position:absolute;width:5px;height:100%;top:0;left:0;background:#359dff}.lr-router .left-panel a.v-link-active:after{content:'';position:absolute;width:3px;height:100%;top:0;right:0;background:#fff}.lr-router .right-panel{margin-left:120px;position:relative;min-width:600px}\", \"\", {\"version\":3,\"sources\":[\"/./components/common-lr-router.vue\"],\"names\":[],\"mappings\":\"AAAA,KAAK,oBAAoB,qBAAqB,oBAAoB,aAAa,4BAA4B,6BAA6B,8BAA8B,0BAA0B,qBAAqB,CAAC,WAAW,mBAAmB,sBAAsB,kBAAkB,cAAc,iBAAiB,CAAC,uBAAuB,cAAc,kBAAkB,MAAM,OAAO,YAAY,YAAY,oCAAqC,CAAC,yBAAyB,kBAAkB,cAAc,kBAAkB,kBAAkB,gBAAgB,CAAC,qDAAqD,wDAAyD,CAAC,uCAAuC,yFAA2F,kBAAkB,CAAC,8CAA8C,WAAW,kBAAkB,UAAU,YAAY,MAAM,OAAO,kBAAkB,CAAC,6CAA6C,WAAW,kBAAkB,UAAU,YAAY,MAAM,QAAQ,eAAe,CAAC,wBAAwB,kBAAkB,kBAAkB,eAAe,CAAC\",\"file\":\"common-lr-router.vue\",\"sourcesContent\":[\"body{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.lr-router{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;position:relative}.lr-router .left-panel{padding-top:0;position:absolute;top:0;left:0;width:120px;height:100%;box-shadow:2px 0 2px rgba(0,0,0,0.05)}.lr-router .left-panel a{position:relative;display:block;margin-right:-3px;text-align:center;line-height:40px}.lr-router .left-panel a:first-of-type.v-link-active{box-shadow:4px 0 0 #fff,0 -2px 2px rgba(0,0,0,0.05) inset}.lr-router .left-panel a.v-link-active{box-shadow:4px 0 0 #fff,0 2px 2px rgba(0,0,0,0.05) inset,0 -2px 2px rgba(0,0,0,0.05) inset;font-weight:bolder}.lr-router .left-panel a.v-link-active:before{content:'';position:absolute;width:5px;height:100%;top:0;left:0;background:#359DFF}.lr-router .left-panel a.v-link-active:after{content:'';position:absolute;width:3px;height:100%;top:0;right:0;background:#fff}.lr-router .right-panel{margin-left:120px;position:relative;min-width:600px}\"],\"sourceRoot\":\"webpack://\"}]);\n\t\n\t// exports\n\n\n/***/ },\n\n/***/ 118:\n/***/ function(module, exports) {\n\n\tmodule.exports = \"<div class=lr-router> <div class=left-panel> <slot></slot> </div> <div class=right-panel> <router-view></router-view> </div> </div>\";\n\n/***/ },\n\n/***/ 124:\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar __vue_script__, __vue_template__\n\t__webpack_require__(126)\n\t__vue_script__ = __webpack_require__(66)\n\t__vue_template__ = __webpack_require__(118)\n\tmodule.exports = __vue_script__ || {}\n\tif (module.exports.__esModule) module.exports = module.exports.default\n\tif (__vue_template__) {\n\t(typeof module.exports === \"function\" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__\n\t}\n\n\n/***/ },\n\n/***/ 126:\n/***/ function(module, exports, __webpack_require__) {\n\n\t// style-loader: Adds some css to the DOM by adding a <style> tag\n\t\n\t// load the styles\n\tvar content = __webpack_require__(111);\n\tif(typeof content === 'string') content = [[module.id, content, '']];\n\t// add the styles to the DOM\n\tvar update = __webpack_require__(2)(content, {});\n\tif(content.locals) module.exports = content.locals;\n\t// Hot Module Replacement\n\tif(false) {\n\t\t// When the styles change, update the <style> tags\n\t\tif(!content.locals) {\n\t\t\tmodule.hot.accept(\"!!./../../node_modules/css-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/style-rewriter.js!./../../node_modules/less-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./common-lr-router.vue\", function() {\n\t\t\t\tvar newContent = require(\"!!./../../node_modules/css-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/style-rewriter.js!./../../node_modules/less-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./common-lr-router.vue\");\n\t\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\t\tupdate(newContent);\n\t\t\t});\n\t\t}\n\t\t// When the module is disposed, remove the <style> tags\n\t\tmodule.hot.dispose(function() { update(); });\n\t}\n\n/***/ },\n\n/***/ 149:\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\t\n\tObject.defineProperty(exports, \"__esModule\", {\n\t\tvalue: true\n\t});\n\t\n\tvar _lineBase = __webpack_require__(17);\n\t\n\tvar _lineBase2 = _interopRequireDefault(_lineBase);\n\t\n\tfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\t\n\texports.default = {\n\t\tprops: {\n\t\t\tnecessary: {\n\t\t\t\tdefault: true\n\t\t\t},\n\t\t\tdisplay: {\n\t\t\t\tdefault: ' '\n\t\t\t},\n\t\t\toptions: Array\n\t\t},\n\t\tdata: function data() {\n\t\t\treturn {\n\t\t\t\tvalue: ''\n\t\t\t};\n\t\t},\n\t\tready: function ready() {\n\t\t\tthis.value = this.$els.selector.firstElementChild.value;\n\t\t},\n\t\n\t\tcomponents: {\n\t\t\tLineBase: _lineBase2.default\n\t\t},\n\t\tmethods: {\n\t\t\tgetValidate: function getValidate() {\n\t\t\t\treturn true;\n\t\t\t},\n\t\t\tgetValue: function getValue() {\n\t\t\t\treturn this.value;\n\t\t\t}\n\t\t}\n\t};\n\n/***/ },\n\n/***/ 153:\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\t\n\tObject.defineProperty(exports, \"__esModule\", {\n\t    value: true\n\t});\n\t\n\tvar _vue = __webpack_require__(3);\n\t\n\tvar _vue2 = _interopRequireDefault(_vue);\n\t\n\tvar _lineSelector = __webpack_require__(244);\n\t\n\tvar _lineSelector2 = _interopRequireDefault(_lineSelector);\n\t\n\tvar _lineInput = __webpack_require__(24);\n\t\n\tvar _lineInput2 = _interopRequireDefault(_lineInput);\n\t\n\tvar _passwordInputs = __webpack_require__(57);\n\t\n\tvar _passwordInputs2 = _interopRequireDefault(_passwordInputs);\n\t\n\tvar _phoneInputs = __webpack_require__(58);\n\t\n\tvar _phoneInputs2 = _interopRequireDefault(_phoneInputs);\n\t\n\tvar _lineBase = __webpack_require__(17);\n\t\n\tvar _lineBase2 = _interopRequireDefault(_lineBase);\n\t\n\tvar _actions = __webpack_require__(4);\n\t\n\tvar _notify = __webpack_require__(12);\n\t\n\tvar _notify2 = _interopRequireDefault(_notify);\n\t\n\tfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\t\n\texports.default = {\n\t    vuex: {\n\t        actions: {\n\t            addUser: _actions.addUser\n\t        }\n\t    },\n\t    data: function data() {\n\t        return {\n\t            submitDisable: false,\n\t            roleOptions: [{\n\t                value: '3',\n\t                text: '开发者'\n\t            }, {\n\t                value: '2',\n\t                text: '物料管理员'\n\t            }, {\n\t                value: '1',\n\t                text: '管理员'\n\t            }]\n\t        };\n\t    },\n\t\n\t    components: {\n\t        LineSelector: _lineSelector2.default,\n\t        FormInput: _lineInput2.default,\n\t        PasswordInputs: _passwordInputs2.default,\n\t        PhoneInputs: _phoneInputs2.default,\n\t        LineBase: _lineBase2.default\n\t    },\n\t    ready: function ready() {},\n\t\n\t    methods: {\n\t        submit: function submit(sendEmail) {\n\t            var _this = this;\n\t\n\t            if (this.submitDisable) {\n\t                return;\n\t            }\n\t            var validate = true;\n\t            ['role', 'username', 'contact', 'email'].forEach(function (tag) {\n\t                if (!_this.$refs[tag].getValidate()) {\n\t                    validate = false;\n\t                } else {\n\t                    _this[tag] = _this.$refs[tag].getValue();\n\t                }\n\t            });\n\t\n\t            if (!validate) {\n\t                return false;\n\t            }\n\t\n\t            this.submitDisable = true;\n\t            setTimeout(function () {\n\t                _this.submitDisable = false;\n\t            }, 1500);\n\t\n\t            this.$refs.phone.getValidate(function (data) {\n\t                _this.phone = _this.$refs.phone.getValue();\n\t                _this.addUser(_this.role, _this.username, _this.contact, _this.phone, _this.email, sendEmail, function (data) {\n\t                    _notify2.default.success('添加账号成功', 3000);\n\t                });\n\t            });\n\t        }\n\t    }\n\t};\n\n/***/ },\n\n/***/ 154:\n/***/ function(module, exports, __webpack_require__) {\n\n\t'use strict';\n\t\n\tObject.defineProperty(exports, \"__esModule\", {\n\t    value: true\n\t});\n\t\n\tvar _commonHeader = __webpack_require__(43);\n\t\n\tvar _commonHeader2 = _interopRequireDefault(_commonHeader);\n\t\n\tvar _commonLrRouter = __webpack_require__(124);\n\t\n\tvar _commonLrRouter2 = _interopRequireDefault(_commonLrRouter);\n\t\n\tvar _actions = __webpack_require__(4);\n\t\n\tfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\t\n\texports.default = {\n\t    vuex: {\n\t        actions: {\n\t            getUser: _actions.getUser\n\t        }\n\t    },\n\t    data: function data() {\n\t        return {};\n\t    },\n\t\n\t    components: {\n\t        commonHeader: _commonHeader2.default,\n\t        commonLrRouter: _commonLrRouter2.default\n\t    },\n\t    ready: function ready() {\n\t        this.getUser();\n\t    },\n\t\n\t    methods: {}\n\t};\n\n/***/ },\n\n/***/ 183:\n/***/ function(module, exports, __webpack_require__) {\n\n\texports = module.exports = __webpack_require__(1)();\n\t// imports\n\t\n\t\n\t// module\n\texports.push([module.id, \".line-input input{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;color:#666}\", \"\", {\"version\":3,\"sources\":[\"/./components/form/line-selector.vue\"],\"names\":[],\"mappings\":\"AAAA,kBAAkB,mBAAmB,sBAAsB,kBAAkB,cAAc,UAAU,CAAC\",\"file\":\"line-selector.vue\",\"sourcesContent\":[\".line-input input{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;color:#666}\"],\"sourceRoot\":\"webpack://\"}]);\n\t\n\t// exports\n\n\n/***/ },\n\n/***/ 186:\n/***/ function(module, exports, __webpack_require__) {\n\n\texports = module.exports = __webpack_require__(1)();\n\t// imports\n\t\n\t\n\t// module\n\texports.push([module.id, \".add-internal-box{position:absolute;top:70px;left:50%;width:500px;margin-left:-400px;color:#333;font-size:16px}.add-internal-box .line-buttons{margin-top:10px}.add-internal-box .line-buttons input[type=button]{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;color:#fff;font-size:14px}.add-internal-box .line-buttons .btn-submit{margin-right:20px}\", \"\", {\"version\":3,\"sources\":[\"/./pages/account/addInternal.vue\"],\"names\":[],\"mappings\":\"AAAA,kBAAkB,kBAAkB,SAAS,SAAS,YAAY,mBAAmB,WAAW,cAAc,CAAC,gCAAgC,eAAe,CAAC,mDAAqD,mBAAmB,sBAAsB,kBAAkB,cAAc,WAAW,cAAc,CAAC,4CAA4C,iBAAiB,CAAC\",\"file\":\"addInternal.vue\",\"sourcesContent\":[\".add-internal-box{position:absolute;top:70px;left:50%;width:500px;margin-left:-400px;color:#333;font-size:16px}.add-internal-box .line-buttons{margin-top:10px}.add-internal-box .line-buttons input[type=\\\"button\\\"]{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;color:#fff;font-size:14px}.add-internal-box .line-buttons .btn-submit{margin-right:20px}\"],\"sourceRoot\":\"webpack://\"}]);\n\t\n\t// exports\n\n\n/***/ },\n\n/***/ 187:\n/***/ function(module, exports, __webpack_require__) {\n\n\texports = module.exports = __webpack_require__(1)();\n\t// imports\n\t\n\t\n\t// module\n\texports.push([module.id, \"\", \"\", {\"version\":3,\"sources\":[],\"names\":[],\"mappings\":\"\",\"file\":\"app.vue\",\"sourceRoot\":\"webpack://\"}]);\n\t\n\t// exports\n\n\n/***/ },\n\n/***/ 214:\n/***/ function(module, exports) {\n\n\tmodule.exports = \"<line-base v-ref:base :necessary=necessary :display=display class=line-seletor> <select v-el:selector class=form-control v-model=value> <option v-for=\\\"option in options\\\" :value=option.value>{{option.text}}</option> </select> </line-base>\";\n\n/***/ },\n\n/***/ 218:\n/***/ function(module, exports) {\n\n\tmodule.exports = \"<div class=add-internal-box> <div class=\\\"form-horizontal form-wrapper\\\"> <line-selector v-ref:role display=角色 :options=roleOptions></line-selector> <form-input v-ref:username display=用户名: error=5~30个字符,支持中英文 pattern=[\\\\S]{5,30} placeholder=5~30个字符,支持中英文></form-input> <form-input v-ref:contact display=联系人姓名: error=请输入正确的姓名 pattern=[\\\\S]{2,4} placeholder=2到4个字符></form-input> <form-input v-ref:email display=联系人邮箱: error=非合法邮箱 pattern=(\\\\w)+(\\\\.\\\\w+)*@(\\\\w)+((\\\\.\\\\w+)+)></form-input> <phone-inputs v-ref:phone display=联系人电话: error=非合法电话号码 pattern=\\\\+?\\\\d{5,13} :verify=false></phone-inputs> <line-base :necessary=false class=line-buttons> <input type=button value=提交并发送邮件 class=\\\"btn btn-primary btn-submit\\\" :class=\\\"{disabled: submitDisable}\\\" @click=submit(true)> <input type=button value=仅提交 class=\\\"btn btn-primary btn-submit\\\" :class=\\\"{disabled: submitDisable}\\\" @click=submit()> <input type=button value=取消 class=\\\"btn btn-default btn-cancel\\\" @click=\\\"$router.go('/login')\\\"> </line-base> </div> </div>\";\n\n/***/ },\n\n/***/ 219:\n/***/ function(module, exports) {\n\n\tmodule.exports = \"<common-header></common-header> <common-lr-router> <a v-link=\\\"{ path: '/addInternal' }\\\">添加内部帐号</a> </common-lr-router>\";\n\n/***/ },\n\n/***/ 244:\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar __vue_script__, __vue_template__\n\t__webpack_require__(271)\n\t__vue_script__ = __webpack_require__(149)\n\t__vue_template__ = __webpack_require__(214)\n\tmodule.exports = __vue_script__ || {}\n\tif (module.exports.__esModule) module.exports = module.exports.default\n\tif (__vue_template__) {\n\t(typeof module.exports === \"function\" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__\n\t}\n\n\n/***/ },\n\n/***/ 245:\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar __vue_script__, __vue_template__\n\t__webpack_require__(274)\n\t__vue_script__ = __webpack_require__(153)\n\t__vue_template__ = __webpack_require__(218)\n\tmodule.exports = __vue_script__ || {}\n\tif (module.exports.__esModule) module.exports = module.exports.default\n\tif (__vue_template__) {\n\t(typeof module.exports === \"function\" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__\n\t}\n\n\n/***/ },\n\n/***/ 246:\n/***/ function(module, exports, __webpack_require__) {\n\n\tvar __vue_script__, __vue_template__\n\t__webpack_require__(275)\n\t__vue_script__ = __webpack_require__(154)\n\t__vue_template__ = __webpack_require__(219)\n\tmodule.exports = __vue_script__ || {}\n\tif (module.exports.__esModule) module.exports = module.exports.default\n\tif (__vue_template__) {\n\t(typeof module.exports === \"function\" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__\n\t}\n\n\n/***/ },\n\n/***/ 271:\n/***/ function(module, exports, __webpack_require__) {\n\n\t// style-loader: Adds some css to the DOM by adding a <style> tag\n\t\n\t// load the styles\n\tvar content = __webpack_require__(183);\n\tif(typeof content === 'string') content = [[module.id, content, '']];\n\t// add the styles to the DOM\n\tvar update = __webpack_require__(2)(content, {});\n\tif(content.locals) module.exports = content.locals;\n\t// Hot Module Replacement\n\tif(false) {\n\t\t// When the styles change, update the <style> tags\n\t\tif(!content.locals) {\n\t\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./line-selector.vue\", function() {\n\t\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./line-selector.vue\");\n\t\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\t\tupdate(newContent);\n\t\t\t});\n\t\t}\n\t\t// When the module is disposed, remove the <style> tags\n\t\tmodule.hot.dispose(function() { update(); });\n\t}\n\n/***/ },\n\n/***/ 274:\n/***/ function(module, exports, __webpack_require__) {\n\n\t// style-loader: Adds some css to the DOM by adding a <style> tag\n\t\n\t// load the styles\n\tvar content = __webpack_require__(186);\n\tif(typeof content === 'string') content = [[module.id, content, '']];\n\t// add the styles to the DOM\n\tvar update = __webpack_require__(2)(content, {});\n\tif(content.locals) module.exports = content.locals;\n\t// Hot Module Replacement\n\tif(false) {\n\t\t// When the styles change, update the <style> tags\n\t\tif(!content.locals) {\n\t\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./addInternal.vue\", function() {\n\t\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./addInternal.vue\");\n\t\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\t\tupdate(newContent);\n\t\t\t});\n\t\t}\n\t\t// When the module is disposed, remove the <style> tags\n\t\tmodule.hot.dispose(function() { update(); });\n\t}\n\n/***/ },\n\n/***/ 275:\n/***/ function(module, exports, __webpack_require__) {\n\n\t// style-loader: Adds some css to the DOM by adding a <style> tag\n\t\n\t// load the styles\n\tvar content = __webpack_require__(187);\n\tif(typeof content === 'string') content = [[module.id, content, '']];\n\t// add the styles to the DOM\n\tvar update = __webpack_require__(2)(content, {});\n\tif(content.locals) module.exports = content.locals;\n\t// Hot Module Replacement\n\tif(false) {\n\t\t// When the styles change, update the <style> tags\n\t\tif(!content.locals) {\n\t\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./app.vue\", function() {\n\t\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./app.vue\");\n\t\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\t\tupdate(newContent);\n\t\t\t});\n\t\t}\n\t\t// When the module is disposed, remove the <style> tags\n\t\tmodule.hot.dispose(function() { update(); });\n\t}\n\n/***/ }\n\n});\n\n\n/** WEBPACK FOOTER **\n ** account.js\n **/", "/**\n * @file 帐号管理的入口文件\n * @author zhanglei55\n */\nimport Vue from 'vue';\nimport App from './app';\nimport store from 'store/store';\nimport VueRouter from 'vue-router';\nimport AddInternal from './addInternal';\n\n$(function () {\n    Vue.use(VueRouter);\n    let router = new VueRouter();\n    router.map({\n        '*': {\n            component: AddInternal\n        },\n        '/addInternal': {\n            component: AddInternal\n        }\n    });\n    router.redirect({\n        '*': '/addInternal'\n    });\n    router.start({\n        store,\n        components: {\n            App\n        }\n    }, '#app');\n});\n\n\n\n/** WEBPACK FOOTER **\n ** ./pages/account/main.js\n **/", "exports = module.exports = require(\"./../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \"body{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.lr-router{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;position:relative}.lr-router .left-panel{padding-top:0;position:absolute;top:0;left:0;width:120px;height:100%;box-shadow:2px 0 2px rgba(0,0,0,.05)}.lr-router .left-panel a{position:relative;display:block;margin-right:-3px;text-align:center;line-height:40px}.lr-router .left-panel a:first-of-type.v-link-active{box-shadow:4px 0 0 #fff,inset 0 -2px 2px rgba(0,0,0,.05)}.lr-router .left-panel a.v-link-active{box-shadow:4px 0 0 #fff,inset 0 2px 2px rgba(0,0,0,.05),inset 0 -2px 2px rgba(0,0,0,.05);font-weight:bolder}.lr-router .left-panel a.v-link-active:before{content:'';position:absolute;width:5px;height:100%;top:0;left:0;background:#359dff}.lr-router .left-panel a.v-link-active:after{content:'';position:absolute;width:3px;height:100%;top:0;right:0;background:#fff}.lr-router .right-panel{margin-left:120px;position:relative;min-width:600px}\", \"\", {\"version\":3,\"sources\":[\"/./components/common-lr-router.vue\"],\"names\":[],\"mappings\":\"AAAA,KAAK,oBAAoB,qBAAqB,oBAAoB,aAAa,4BAA4B,6BAA6B,8BAA8B,0BAA0B,qBAAqB,CAAC,WAAW,mBAAmB,sBAAsB,kBAAkB,cAAc,iBAAiB,CAAC,uBAAuB,cAAc,kBAAkB,MAAM,OAAO,YAAY,YAAY,oCAAqC,CAAC,yBAAyB,kBAAkB,cAAc,kBAAkB,kBAAkB,gBAAgB,CAAC,qDAAqD,wDAAyD,CAAC,uCAAuC,yFAA2F,kBAAkB,CAAC,8CAA8C,WAAW,kBAAkB,UAAU,YAAY,MAAM,OAAO,kBAAkB,CAAC,6CAA6C,WAAW,kBAAkB,UAAU,YAAY,MAAM,QAAQ,eAAe,CAAC,wBAAwB,kBAAkB,kBAAkB,eAAe,CAAC\",\"file\":\"common-lr-router.vue\",\"sourcesContent\":[\"body{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.lr-router{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;position:relative}.lr-router .left-panel{padding-top:0;position:absolute;top:0;left:0;width:120px;height:100%;box-shadow:2px 0 2px rgba(0,0,0,0.05)}.lr-router .left-panel a{position:relative;display:block;margin-right:-3px;text-align:center;line-height:40px}.lr-router .left-panel a:first-of-type.v-link-active{box-shadow:4px 0 0 #fff,0 -2px 2px rgba(0,0,0,0.05) inset}.lr-router .left-panel a.v-link-active{box-shadow:4px 0 0 #fff,0 2px 2px rgba(0,0,0,0.05) inset,0 -2px 2px rgba(0,0,0,0.05) inset;font-weight:bolder}.lr-router .left-panel a.v-link-active:before{content:'';position:absolute;width:5px;height:100%;top:0;left:0;background:#359DFF}.lr-router .left-panel a.v-link-active:after{content:'';position:absolute;width:3px;height:100%;top:0;right:0;background:#fff}.lr-router .right-panel{margin-left:120px;position:relative;min-width:600px}\"],\"sourceRoot\":\"webpack://\"}]);\n\n// exports\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/css-loader?sourceMap!../~/vue-loader/lib/style-rewriter.js!../~/less-loader?sourceMap!../~/vue-loader/lib/selector.js?type=style&index=0!./components/common-lr-router.vue\n ** module id = 111\n ** module chunks = 1 5\n **/", "module.exports = \"<div class=lr-router> <div class=left-panel> <slot></slot> </div> <div class=right-panel> <router-view></router-view> </div> </div>\";\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/vue-html-loader!../~/vue-loader/lib/selector.js?type=template&index=0!./components/common-lr-router.vue\n ** module id = 118\n ** module chunks = 1 5\n **/", "var __vue_script__, __vue_template__\nrequire(\"!!vue-style-loader!css-loader?sourceMap!./../../node_modules/vue-loader/lib/style-rewriter.js!less-loader?sourceMap!./../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./common-lr-router.vue\")\n__vue_script__ = require(\"!!babel-loader?presets[]=es2015&plugins[]=transform-runtime&comments=false!./../../node_modules/vue-loader/lib/selector.js?type=script&index=0!./common-lr-router.vue\")\n__vue_template__ = require(\"!!vue-html-loader!./../../node_modules/vue-loader/lib/selector.js?type=template&index=0!./common-lr-router.vue\")\nmodule.exports = __vue_script__ || {}\nif (module.exports.__esModule) module.exports = module.exports.default\nif (__vue_template__) {\n(typeof module.exports === \"function\" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./components/common-lr-router.vue\n ** module id = 124\n ** module chunks = 1 5\n **/", "// style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../node_modules/css-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/style-rewriter.js!./../../node_modules/less-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./common-lr-router.vue\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../node_modules/vue-style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../node_modules/css-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/style-rewriter.js!./../../node_modules/less-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./common-lr-router.vue\", function() {\n\t\t\tvar newContent = require(\"!!./../../node_modules/css-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/style-rewriter.js!./../../node_modules/less-loader/index.js?sourceMap!./../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./common-lr-router.vue\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/vue-style-loader!../~/css-loader?sourceMap!../~/vue-loader/lib/style-rewriter.js!../~/less-loader?sourceMap!../~/vue-loader/lib/selector.js?type=style&index=0!./components/common-lr-router.vue\n ** module id = 126\n ** module chunks = 1 5\n **/", "<style lang=\"less\">\n\t.line-input {\n        input {\n            flex: auto 1 1;\n            color: #666;\n        }\n\t}\n</style>\n\n<template>\n    <line-base v-ref:base :necessary=\"necessary\" :display=\"display\" class=\"line-seletor\">\n    \t<select v-el:selector class=\"form-control\" v-model=\"value\" >\n        \t<option v-for=\"option in options\" :value=\"option.value\" >{{option.text}}</option>\n        </select>\n    </line-base>\n</template>\n\n<script>\nimport LineBase from 'components/form/line-base';\n\nexport default {\n\tprops: {\n\t\tnecessary: {\n\t\t\tdefault: true\n\t\t},\n\t\tdisplay: {\n\t\t\tdefault: ' '\n\t\t},\n\t\toptions: Array\n\t},\n\tdata() {\n\t\treturn {\n\t\t\tvalue: ''\n\t\t}\n\t},\n\tready() {\n\t\tthis.value = this.$els.selector.firstElementChild.value;\n\t},\n\tcomponents: {\n\t\tLineBase\n\t},\n\tmethods: {\n\t\tgetValidate() {\n\t\t\treturn true;\n\t\t},\n\t\tgetValue() {\n\t\t\treturn this.value;\n\t\t}\n\t}\n}\n</script>\n\n\n/** WEBPACK FOOTER **\n ** line-selector.vue?f28cdc50\n **/", "<style lang=\"less\">\n.add-internal-box {\n    position: absolute;\n    top: 70px;\n    left: 50%;\n    width: 500px;\n    margin-left: -400px;\n    color: #333;\n    font-size: 16px;\n\n    \n    .line-buttons {\n        margin-top: 10px;\n        input[type=\"button\"] {\n            flex: auto 1 1;\n            color: #fff;\n            font-size: 14px;\n        }\n        .btn-submit {\n            margin-right: 20px;\n        }\n        .btn-cancel {}\n    }\n}\n</style>\n\n<template>\n    <div class=\"add-internal-box\">\n        <div class=\"form-horizontal form-wrapper\">\n            <line-selector v-ref:role display=\"角色\" :options=\"roleOptions\"></line-selector>\n            <form-input v-ref:username display=\"用户名:\"  error=\"5~30个字符,支持中英文\" pattern=\"[\\S]{5,30}\" placeholder=\"5~30个字符,支持中英文\"></form-input>\n            <!-- <password-inputs v-ref:password  error=\"6-32位字符,包括数字、大小写英文字母\" pattern=\"[0-9a-zA-Z]{6,32}\" placeholder=\"6-32位字符,包括数字、大小写英文字母\"></password-inputs> -->\n            <form-input v-ref:contact display=\"联系人姓名:\" error=\"请输入正确的姓名\" pattern=\"[\\S]{2,4}\" placeholder=\"2到4个字符\"></form-input>\n            <form-input v-ref:email display=\"联系人邮箱:\" error=\"非合法邮箱\" pattern=\"(\\w)+(\\.\\w+)*@(\\w)+((\\.\\w+)+)\"></form-input>\n            <phone-inputs v-ref:phone display=\"联系人电话:\" error=\"非合法电话号码\" pattern=\"\\+?\\d{5,13}\" :verify=\"false\"></phone-inputs>\n            <line-base :necessary=\"false\" class=\"line-buttons\">\n                <input type=\"button\" value=\"提交并发送邮件\" class=\"btn btn-primary btn-submit\" :class=\"{disabled: submitDisable}\" @click=\"submit(true)\">\n                <input type=\"button\" value=\"仅提交\" class=\"btn btn-primary btn-submit\" :class=\"{disabled: submitDisable}\" @click=\"submit()\">\n                <input type=\"button\" value=\"取消\" class=\"btn btn-default btn-cancel\" @click=\"$router.go('/login')\">\n            </line-base>\n        </div>\n    </div>\n</template>\n\n<script>\nimport Vue from 'vue';\nimport LineSelector from 'components/form/line-selector';\nimport FormInput from 'components/form/line-input';\nimport PasswordInputs from 'components/form/password-inputs';\nimport PhoneInputs from 'components/form/phone-inputs';\nimport LineBase from 'components/form/line-base';\nimport {\n    addUser\n} from 'store/actions';\nimport Notify from 'common/notify';\n\nexport default {\n    vuex: {\n        actions: {\n            addUser\n        }\n    },\n    data() {\n        return {\n            submitDisable: false,\n            roleOptions: [\n                {\n                    value: '3',\n                    text: '开发者'\n                },\n                {\n                    value: '2',\n                    text: '物料管理员'\n                },\n                {\n                    value: '1',\n                    text: '管理员'\n                }\n            ]\n        }\n    },\n    components: {\n        LineSelector,\n        FormInput,\n        PasswordInputs,\n        PhoneInputs,\n        LineBase\n    },\n    ready() {\n\n    },\n    methods: {\n        submit(sendEmail) {\n            if (this.submitDisable) {\n                return;\n            }\n            var validate = true;\n            ['role', 'username', 'contact', 'email'].forEach(tag => {\n                if (!this.$refs[tag].getValidate()) {\n                    validate = false;\n                } else {\n                    this[tag] = this.$refs[tag].getValue();\n                }\n            });\n            \n            if (!validate) {\n                return false;\n            }\n\n            this.submitDisable = true;\n            setTimeout(() => {\n                this.submitDisable = false;\n            }, 1500);\n\n            this.$refs.phone.getValidate(data => {\n                this.phone = this.$refs.phone.getValue();\n                this.addUser(this.role, this.username, this.contact, this.phone, this.email, sendEmail, data => {\n                    Notify.success('添加账号成功', 3000);\n                });\n            });\n        }\n    }\n}\n</script>\n\n\n/** WEBPACK FOOTER **\n ** addInternal.vue?3e65ee0a\n **/", "<style lang=\"less\">\n</style>\n\n<template>\n    <common-header></common-header>\n    <common-lr-router>\n        <a v-link=\"{ path: '/addInternal' }\">添加内部帐号</a>\n    </common-lr-router>\n</template>\n\n<script>\nimport commonHeader from 'components/common-header';\nimport commonLrRouter from 'components/common-lr-router';\nimport {\n    getUser\n} from 'store/actions';\n\nexport default {\n    vuex: {\n        actions: {\n            getUser\n        }\n    },\n    data() {\n        return {}\n    },\n    components: {\n        commonHeader,\n        commonLrRouter\n    },\n    ready() {\n        this.getUser();\n    },\n    methods: {}\n}\n</script>\n\n\n/** WEBPACK FOOTER **\n ** app.vue?12bb772a\n **/", "exports = module.exports = require(\"./../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \".line-input input{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;color:#666}\", \"\", {\"version\":3,\"sources\":[\"/./components/form/line-selector.vue\"],\"names\":[],\"mappings\":\"AAAA,kBAAkB,mBAAmB,sBAAsB,kBAAkB,cAAc,UAAU,CAAC\",\"file\":\"line-selector.vue\",\"sourcesContent\":[\".line-input input{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;color:#666}\"],\"sourceRoot\":\"webpack://\"}]);\n\n// exports\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/css-loader?sourceMap!../~/vue-loader/lib/style-rewriter.js!../~/less-loader?sourceMap!../~/vue-loader/lib/selector.js?type=style&index=0!./components/form/line-selector.vue\n ** module id = 183\n ** module chunks = 5\n **/", "exports = module.exports = require(\"./../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \".add-internal-box{position:absolute;top:70px;left:50%;width:500px;margin-left:-400px;color:#333;font-size:16px}.add-internal-box .line-buttons{margin-top:10px}.add-internal-box .line-buttons input[type=button]{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;color:#fff;font-size:14px}.add-internal-box .line-buttons .btn-submit{margin-right:20px}\", \"\", {\"version\":3,\"sources\":[\"/./pages/account/addInternal.vue\"],\"names\":[],\"mappings\":\"AAAA,kBAAkB,kBAAkB,SAAS,SAAS,YAAY,mBAAmB,WAAW,cAAc,CAAC,gCAAgC,eAAe,CAAC,mDAAqD,mBAAmB,sBAAsB,kBAAkB,cAAc,WAAW,cAAc,CAAC,4CAA4C,iBAAiB,CAAC\",\"file\":\"addInternal.vue\",\"sourcesContent\":[\".add-internal-box{position:absolute;top:70px;left:50%;width:500px;margin-left:-400px;color:#333;font-size:16px}.add-internal-box .line-buttons{margin-top:10px}.add-internal-box .line-buttons input[type=\\\"button\\\"]{-webkit-box-flex:1;-webkit-flex:auto 1 1;-ms-flex:auto 1 1;flex:auto 1 1;color:#fff;font-size:14px}.add-internal-box .line-buttons .btn-submit{margin-right:20px}\"],\"sourceRoot\":\"webpack://\"}]);\n\n// exports\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/css-loader?sourceMap!../~/vue-loader/lib/style-rewriter.js!../~/less-loader?sourceMap!../~/vue-loader/lib/selector.js?type=style&index=0!./pages/account/addInternal.vue\n ** module id = 186\n ** module chunks = 5\n **/", "exports = module.exports = require(\"./../../../node_modules/css-loader/lib/css-base.js\")();\n// imports\n\n\n// module\nexports.push([module.id, \"\", \"\", {\"version\":3,\"sources\":[],\"names\":[],\"mappings\":\"\",\"file\":\"app.vue\",\"sourceRoot\":\"webpack://\"}]);\n\n// exports\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/css-loader?sourceMap!../~/vue-loader/lib/style-rewriter.js!../~/less-loader?sourceMap!../~/vue-loader/lib/selector.js?type=style&index=0!./pages/account/app.vue\n ** module id = 187\n ** module chunks = 5\n **/", "module.exports = \"<line-base v-ref:base :necessary=necessary :display=display class=line-seletor> <select v-el:selector class=form-control v-model=value> <option v-for=\\\"option in options\\\" :value=option.value>{{option.text}}</option> </select> </line-base>\";\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/vue-html-loader!../~/vue-loader/lib/selector.js?type=template&index=0!./components/form/line-selector.vue\n ** module id = 214\n ** module chunks = 5\n **/", "module.exports = \"<div class=add-internal-box> <div class=\\\"form-horizontal form-wrapper\\\"> <line-selector v-ref:role display=角色 :options=roleOptions></line-selector> <form-input v-ref:username display=用户名: error=5~30个字符,支持中英文 pattern=[\\\\S]{5,30} placeholder=5~30个字符,支持中英文></form-input> <form-input v-ref:contact display=联系人姓名: error=请输入正确的姓名 pattern=[\\\\S]{2,4} placeholder=2到4个字符></form-input> <form-input v-ref:email display=联系人邮箱: error=非合法邮箱 pattern=(\\\\w)+(\\\\.\\\\w+)*@(\\\\w)+((\\\\.\\\\w+)+)></form-input> <phone-inputs v-ref:phone display=联系人电话: error=非合法电话号码 pattern=\\\\+?\\\\d{5,13} :verify=false></phone-inputs> <line-base :necessary=false class=line-buttons> <input type=button value=提交并发送邮件 class=\\\"btn btn-primary btn-submit\\\" :class=\\\"{disabled: submitDisable}\\\" @click=submit(true)> <input type=button value=仅提交 class=\\\"btn btn-primary btn-submit\\\" :class=\\\"{disabled: submitDisable}\\\" @click=submit()> <input type=button value=取消 class=\\\"btn btn-default btn-cancel\\\" @click=\\\"$router.go('/login')\\\"> </line-base> </div> </div>\";\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/vue-html-loader!../~/vue-loader/lib/selector.js?type=template&index=0!./pages/account/addInternal.vue\n ** module id = 218\n ** module chunks = 5\n **/", "module.exports = \"<common-header></common-header> <common-lr-router> <a v-link=\\\"{ path: '/addInternal' }\\\">添加内部帐号</a> </common-lr-router>\";\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/vue-html-loader!../~/vue-loader/lib/selector.js?type=template&index=0!./pages/account/app.vue\n ** module id = 219\n ** module chunks = 5\n **/", "var __vue_script__, __vue_template__\nrequire(\"!!vue-style-loader!css-loader?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!less-loader?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./line-selector.vue\")\n__vue_script__ = require(\"!!babel-loader?presets[]=es2015&plugins[]=transform-runtime&comments=false!./../../../node_modules/vue-loader/lib/selector.js?type=script&index=0!./line-selector.vue\")\n__vue_template__ = require(\"!!vue-html-loader!./../../../node_modules/vue-loader/lib/selector.js?type=template&index=0!./line-selector.vue\")\nmodule.exports = __vue_script__ || {}\nif (module.exports.__esModule) module.exports = module.exports.default\nif (__vue_template__) {\n(typeof module.exports === \"function\" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./components/form/line-selector.vue\n ** module id = 244\n ** module chunks = 5\n **/", "var __vue_script__, __vue_template__\nrequire(\"!!vue-style-loader!css-loader?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!less-loader?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./addInternal.vue\")\n__vue_script__ = require(\"!!babel-loader?presets[]=es2015&plugins[]=transform-runtime&comments=false!./../../../node_modules/vue-loader/lib/selector.js?type=script&index=0!./addInternal.vue\")\n__vue_template__ = require(\"!!vue-html-loader!./../../../node_modules/vue-loader/lib/selector.js?type=template&index=0!./addInternal.vue\")\nmodule.exports = __vue_script__ || {}\nif (module.exports.__esModule) module.exports = module.exports.default\nif (__vue_template__) {\n(typeof module.exports === \"function\" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./pages/account/addInternal.vue\n ** module id = 245\n ** module chunks = 5\n **/", "var __vue_script__, __vue_template__\nrequire(\"!!vue-style-loader!css-loader?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!less-loader?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./app.vue\")\n__vue_script__ = require(\"!!babel-loader?presets[]=es2015&plugins[]=transform-runtime&comments=false!./../../../node_modules/vue-loader/lib/selector.js?type=script&index=0!./app.vue\")\n__vue_template__ = require(\"!!vue-html-loader!./../../../node_modules/vue-loader/lib/selector.js?type=template&index=0!./app.vue\")\nmodule.exports = __vue_script__ || {}\nif (module.exports.__esModule) module.exports = module.exports.default\nif (__vue_template__) {\n(typeof module.exports === \"function\" ? (module.exports.options || (module.exports.options = {})) : module.exports).template = __vue_template__\n}\n\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./pages/account/app.vue\n ** module id = 246\n ** module chunks = 5\n **/", "// style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./line-selector.vue\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../node_modules/vue-style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./line-selector.vue\", function() {\n\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./line-selector.vue\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/vue-style-loader!../~/css-loader?sourceMap!../~/vue-loader/lib/style-rewriter.js!../~/less-loader?sourceMap!../~/vue-loader/lib/selector.js?type=style&index=0!./components/form/line-selector.vue\n ** module id = 271\n ** module chunks = 5\n **/", "// style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./addInternal.vue\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../node_modules/vue-style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./addInternal.vue\", function() {\n\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./addInternal.vue\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/vue-style-loader!../~/css-loader?sourceMap!../~/vue-loader/lib/style-rewriter.js!../~/less-loader?sourceMap!../~/vue-loader/lib/selector.js?type=style&index=0!./pages/account/addInternal.vue\n ** module id = 274\n ** module chunks = 5\n **/", "// style-loader: Adds some css to the DOM by adding a <style> tag\n\n// load the styles\nvar content = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./app.vue\");\nif(typeof content === 'string') content = [[module.id, content, '']];\n// add the styles to the DOM\nvar update = require(\"!./../../../node_modules/vue-style-loader/addStyles.js\")(content, {});\nif(content.locals) module.exports = content.locals;\n// Hot Module Replacement\nif(module.hot) {\n\t// When the styles change, update the <style> tags\n\tif(!content.locals) {\n\t\tmodule.hot.accept(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./app.vue\", function() {\n\t\t\tvar newContent = require(\"!!./../../../node_modules/css-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/style-rewriter.js!./../../../node_modules/less-loader/index.js?sourceMap!./../../../node_modules/vue-loader/lib/selector.js?type=style&index=0!./app.vue\");\n\t\t\tif(typeof newContent === 'string') newContent = [[module.id, newContent, '']];\n\t\t\tupdate(newContent);\n\t\t});\n\t}\n\t// When the module is disposed, remove the <style> tags\n\tmodule.hot.dispose(function() { update(); });\n}\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ../~/vue-style-loader!../~/css-loader?sourceMap!../~/vue-loader/lib/style-rewriter.js!../~/less-loader?sourceMap!../~/vue-loader/lib/selector.js?type=style&index=0!./pages/account/app.vue\n ** module id = 275\n ** module chunks = 5\n **/"],
        "sourceRoot": ""
    }
    
  3. eval-source-map:loader转译之后的代码都在eval里面执行,在eval代码里最后面使用sourceMappingURL=dataURL:base64;在浏览器展示中对应的是源文件。这里的dataURL就是一个完全自包含的source-map。

    在eval-source-map:eval最后的dataurl base64解码之后得到完整的*.js.map文件内容如下:

    {
        "version": 3,
        "sources": ["webpack:///app.vue?a737"],
        "names": [],
        "mappings": ";;;;;;AAWA;;;;AACA;;;;AAKA;;;;;;;AAMA;AAHA;AADA;0BAKA;eACA;AACA;;;AAEA;AAEA;AAHA;4BAIA;aACA;AACA;;aACA;AAhBA",
        "file": "154.js",
        "sourcesContent": ["<style lang=\"less\">\n</style>\n\n<template>\n    <common-header></common-header>\n    <common-lr-router>\n        <a v-link=\"{ path: '/addInternal' }\">添加内部帐号</a>\n    </common-lr-router>\n</template>\n\n<script>\nimport commonHeader from 'components/common-header';\nimport commonLrRouter from 'components/common-lr-router';\nimport {\n    getUser\n} from 'store/actions';\n\nexport default {\n    vuex: {\n        actions: {\n            getUser\n        }\n    },\n    data() {\n        return {}\n    },\n    components: {\n        commonHeader,\n        commonLrRouter\n    },\n    ready() {\n        this.getUser();\n    },\n    methods: {}\n}\n</script>\n\n\n/** WEBPACK FOOTER **\n ** app.vue?12bb772a\n **/"],
        "sourceRoot": ""
    }
    

    可以从*.js.map(定义了sources、sourceConent)中完美解析出一个app.vue源文件。包括source-map内容告诉浏览器源文件的自定义地址。。

  4. inline-source-map:loader转译之后代码都在webpack_require闭包里面执行,非eval,在最后添加sourceMapURL=dataURL。(建议使用)

结论:

  1. webpack产生的source-map基本上都是自包含的source-map
  2. webpack要求loader提供sourcemap,webpack的source-map与loader的source-map关系还不是很明确,(最终肯定是结合产生的sourcemap);在webpack里面可能有很多种策略,关于如何使用loader的sourcemap,需要进一步阅读webpack的源码查找。
  3. webpack sourcemap在eval模式下页面加载过程中设置的短点是无效的;建议使用inline-sourcemap的模式,可以在一开始加载就有效。