{"version":3,"sources":["webpack:///217.add71913.js","webpack:///vue-webpack-code-splitting-async-171.vue","webpack:///./~/v-markdown-loader/_cache/vue-webpack-code-splitting-async-171.vue","webpack:///./~/v-markdown-loader/_cache/vue-webpack-code-splitting-async-171.vue?df0c","webpack:///./en/development/vue-webpack-code-splitting-async.md"],"names":["webpackJsonp","1430","module","__webpack_exports__","__webpack_require__","Object","defineProperty","value","head","title","ignoreSuffixChar","2384","exports","Component","options","__file","esModule","keys","some","key","substr","console","error","functional","2666","render","_vm","this","_h","$createElement","_self","_c","_m","staticRenderFns","_v","attrs","href","staticClass","_withStripped","579"],"mappings":"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","file":"217.add71913.js","sourcesContent":["webpackJsonp([217],{\n\n/***/ 1430:\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\nObject.defineProperty(__webpack_exports__, \"__esModule\", { value: true });\n\n\n/* harmony default export */ __webpack_exports__[\"default\"] = ({\n  head: { \"title\": \"Vue 异步加载组件 | VUX - Vue 移动端 UI 组件库\", \"ignoreSuffixChar\": \"|\" }\n});\n\n/***/ }),\n\n/***/ 2384:\n/***/ (function(module, exports, __webpack_require__) {\n\nvar disposed = false\nvar Component = __webpack_require__(67)(\n  /* script */\n  __webpack_require__(1430),\n  /* template */\n  __webpack_require__(2666),\n  /* styles */\n  null,\n  /* scopeId */\n  null,\n  /* moduleIdentifier (server only) */\n  null\n)\nComponent.options.__file = \"/data/vux/home/websites/vux-repo/docs/node_modules/v-markdown-loader/_cache/vue-webpack-code-splitting-async-171.vue\"\nif (Component.esModule && Object.keys(Component.esModule).some(function (key) {return key !== \"default\" && key.substr(0, 2) !== \"__\"})) {console.error(\"named exports are not supported in *.vue files.\")}\nif (Component.options.functional) {console.error(\"[vue-loader] vue-webpack-code-splitting-async-171.vue: functional components are not supported with templates, they should use render functions.\")}\n\n/* hot reload */\nif (false) {(function () {\n  var hotAPI = require(\"vue-hot-reload-api\")\n  hotAPI.install(require(\"vue\"), false)\n  if (!hotAPI.compatible) return\n  module.hot.accept()\n  if (!module.hot.data) {\n    hotAPI.createRecord(\"data-v-4120d964\", Component.options)\n  } else {\n    hotAPI.reload(\"data-v-4120d964\", Component.options)\n  }\n  module.hot.dispose(function (data) {\n    disposed = true\n  })\n})()}\n\nmodule.exports = Component.exports\n\n\n/***/ }),\n\n/***/ 2666:\n/***/ (function(module, exports, __webpack_require__) {\n\nmodule.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n  return _vm._m(0)\n},staticRenderFns: [function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n  return _c('div', [_c('h1', [_vm._v(\"异步加载组件\")]), _vm._v(\" \"), _c('p', [_vm._v(\"将所有页面组件一次性加载是一个很浪费资源和考验用户耐心的做法，尤其在移动端。\")]), _vm._v(\" \"), _c('h2', [_vm._v(\"使用方法\")]), _vm._v(\" \"), _c('p', [_c('code', [_vm._v(\"webpack\")]), _vm._v(\" 提供了\"), _c('a', {\n    attrs: {\n      \"href\": \"https://webpack.js.org/guides/code-splitting-require/\"\n    }\n  }, [_vm._v(\"code splitting\")]), _vm._v(\"，你可以按照下面写法实现当切换到特定路由时才加载代码。\")]), _vm._v(\" \"), _c('p', [_vm._v(\"需要注意的是 \"), _c('code', [_vm._v(\"vue-loader@13.0.0\")]), _vm._v(\" 语法有所变更，具体参照发布说明 \"), _c('a', {\n    attrs: {\n      \"href\": \"https://github.com/vuejs/vue-loader/releases/tag/v13.0.0\"\n    }\n  }, [_vm._v(\"v13.0.0\")])]), _vm._v(\" \"), _c('pre', {\n    staticClass: \"hljs\"\n  }, [_c('code', [_c('span', {\n    staticClass: \"hljs-comment\"\n  }, [_vm._v(\"// vue-loader@13.0.0 之前\")]), _vm._v(\"\\n\"), _c('span', {\n    staticClass: \"hljs-keyword\"\n  }, [_vm._v(\"const\")]), _vm._v(\" Foo = \"), _c('span', {\n    staticClass: \"hljs-function\"\n  }, [_c('span', {\n    staticClass: \"hljs-params\"\n  }, [_vm._v(\"()\")]), _vm._v(\" =>\")]), _vm._v(\" \"), _c('span', {\n    staticClass: \"hljs-keyword\"\n  }, [_vm._v(\"import\")]), _vm._v(\"(\"), _c('span', {\n    staticClass: \"hljs-string\"\n  }, [_vm._v(\"'./Foo.vue'\")]), _vm._v(\") \"), _c('span', {\n    staticClass: \"hljs-comment\"\n  }, [_vm._v(\"// 在 Vue 2.4 + vue-router 2.7 版本下可以正确运行\")]), _vm._v(\"\\n\\n\"), _c('span', {\n    staticClass: \"hljs-comment\"\n  }, [_vm._v(\"// vue-loader@13.0.0\")]), _vm._v(\"\\n\"), _c('span', {\n    staticClass: \"hljs-keyword\"\n  }, [_vm._v(\"const\")]), _vm._v(\" Foo = \"), _c('span', {\n    staticClass: \"hljs-function\"\n  }, [_c('span', {\n    staticClass: \"hljs-params\"\n  }, [_vm._v(\"()\")]), _vm._v(\" =>\")]), _vm._v(\" \"), _c('span', {\n    staticClass: \"hljs-keyword\"\n  }, [_vm._v(\"import\")]), _vm._v(\"(\"), _c('span', {\n    staticClass: \"hljs-string\"\n  }, [_vm._v(\"'./Foo.vue'\")]), _vm._v(\").then(\"), _c('span', {\n    staticClass: \"hljs-function\"\n  }, [_c('span', {\n    staticClass: \"hljs-params\"\n  }, [_vm._v(\"m\")]), _vm._v(\" =>\")]), _vm._v(\" m.default)\\n\")])]), _vm._v(\" \"), _c('h2', [_vm._v(\"组件打包问题\")]), _vm._v(\" \"), _c('p', [_vm._v(\"如果你在不同的进行了代码分割的 .vue 文件引入了相同的组件，在打包时两个路由的代码都会重复打包该组件。\")]), _vm._v(\" \"), _c('p', [_vm._v(\"你可以对重复使用的组件在 \"), _c('code', [_vm._v(\"main.js\")]), _vm._v(\" 进行全局注册，以减少相应 chunk file 的大小并提高下载速度。\")])])\n}]}\nmodule.exports.render._withStripped = true\nif (false) {\n  module.hot.accept()\n  if (module.hot.data) {\n     require(\"vue-hot-reload-api\").rerender(\"data-v-4120d964\", module.exports)\n  }\n}\n\n/***/ }),\n\n/***/ 579:\n/***/ (function(module, exports, __webpack_require__) {\n\nmodule.exports = __webpack_require__(2384);\n\n/***/ })\n\n});\n\n\n// WEBPACK FOOTER //\n// 217.add71913.js","<template><div><h1>异步加载组件</h1>\n<p>将所有页面组件一次性加载是一个很浪费资源和考验用户耐心的做法，尤其在移动端。</p>\n<h2>使用方法</h2>\n<p><code>webpack</code> 提供了<a href=\"https://webpack.js.org/guides/code-splitting-require/\">code splitting</a>，你可以按照下面写法实现当切换到特定路由时才加载代码。</p>\n<p>需要注意的是 <code>vue-loader@13.0.0</code> 语法有所变更，具体参照发布说明 <a href=\"https://github.com/vuejs/vue-loader/releases/tag/v13.0.0\">v13.0.0</a></p>\n<pre class=\"hljs\"><code><span class=\"hljs-comment\">// vue-loader@13.0.0 之前</span>\n<span class=\"hljs-keyword\">const</span> Foo = <span class=\"hljs-function\"><span class=\"hljs-params\">()</span> =&gt;</span> <span class=\"hljs-keyword\">import</span>(<span class=\"hljs-string\">'./Foo.vue'</span>) <span class=\"hljs-comment\">// 在 Vue 2.4 + vue-router 2.7 版本下可以正确运行</span>\n\n<span class=\"hljs-comment\">// vue-loader@13.0.0</span>\n<span class=\"hljs-keyword\">const</span> Foo = <span class=\"hljs-function\"><span class=\"hljs-params\">()</span> =&gt;</span> <span class=\"hljs-keyword\">import</span>(<span class=\"hljs-string\">'./Foo.vue'</span>).then(<span class=\"hljs-function\"><span class=\"hljs-params\">m</span> =&gt;</span> m.default)\n</code></pre>\n<h2>组件打包问题</h2>\n<p>如果你在不同的进行了代码分割的 .vue 文件引入了相同的组件，在打包时两个路由的代码都会重复打包该组件。</p>\n<p>你可以对重复使用的组件在 <code>main.js</code> 进行全局注册，以减少相应 chunk file 的大小并提高下载速度。</p>\n</div></template><script>\nexport default {\n  head: {\"title\":\"Vue 异步加载组件 | VUX - Vue 移动端 UI 组件库\",\"ignoreSuffixChar\":\"|\"}\n}\n  </script>\n\n\n// WEBPACK FOOTER //\n// vue-webpack-code-splitting-async-171.vue?6ce79973","var disposed = false\nvar Component = require(\"!../../ream/node_modules/vue-loader/lib/component-normalizer\")(\n  /* script */\n  require(\"!!babel-loader!../../ream/node_modules/vue-loader/lib/selector?type=script&index=0!./vue-webpack-code-splitting-async-171.vue\"),\n  /* template */\n  require(\"!!../../ream/node_modules/vue-loader/lib/template-compiler/index?{\\\"id\\\":\\\"data-v-4120d964\\\"}!../../ream/node_modules/vue-loader/lib/selector?type=template&index=0!./vue-webpack-code-splitting-async-171.vue\"),\n  /* styles */\n  null,\n  /* scopeId */\n  null,\n  /* moduleIdentifier (server only) */\n  null\n)\nComponent.options.__file = \"/data/vux/home/websites/vux-repo/docs/node_modules/v-markdown-loader/_cache/vue-webpack-code-splitting-async-171.vue\"\nif (Component.esModule && Object.keys(Component.esModule).some(function (key) {return key !== \"default\" && key.substr(0, 2) !== \"__\"})) {console.error(\"named exports are not supported in *.vue files.\")}\nif (Component.options.functional) {console.error(\"[vue-loader] vue-webpack-code-splitting-async-171.vue: functional components are not supported with templates, they should use render functions.\")}\n\n/* hot reload */\nif (module.hot) {(function () {\n  var hotAPI = require(\"vue-hot-reload-api\")\n  hotAPI.install(require(\"vue\"), false)\n  if (!hotAPI.compatible) return\n  module.hot.accept()\n  if (!module.hot.data) {\n    hotAPI.createRecord(\"data-v-4120d964\", Component.options)\n  } else {\n    hotAPI.reload(\"data-v-4120d964\", Component.options)\n  }\n  module.hot.dispose(function (data) {\n    disposed = true\n  })\n})()}\n\nmodule.exports = Component.exports\n\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./~/ream/~/vue-loader!./~/v-markdown-loader/_cache/vue-webpack-code-splitting-async-171.vue\n// module id = 2384\n// module chunks = 217","module.exports={render:function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n  return _vm._m(0)\n},staticRenderFns: [function (){var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;\n  return _c('div', [_c('h1', [_vm._v(\"异步加载组件\")]), _vm._v(\" \"), _c('p', [_vm._v(\"将所有页面组件一次性加载是一个很浪费资源和考验用户耐心的做法，尤其在移动端。\")]), _vm._v(\" \"), _c('h2', [_vm._v(\"使用方法\")]), _vm._v(\" \"), _c('p', [_c('code', [_vm._v(\"webpack\")]), _vm._v(\" 提供了\"), _c('a', {\n    attrs: {\n      \"href\": \"https://webpack.js.org/guides/code-splitting-require/\"\n    }\n  }, [_vm._v(\"code splitting\")]), _vm._v(\"，你可以按照下面写法实现当切换到特定路由时才加载代码。\")]), _vm._v(\" \"), _c('p', [_vm._v(\"需要注意的是 \"), _c('code', [_vm._v(\"vue-loader@13.0.0\")]), _vm._v(\" 语法有所变更，具体参照发布说明 \"), _c('a', {\n    attrs: {\n      \"href\": \"https://github.com/vuejs/vue-loader/releases/tag/v13.0.0\"\n    }\n  }, [_vm._v(\"v13.0.0\")])]), _vm._v(\" \"), _c('pre', {\n    staticClass: \"hljs\"\n  }, [_c('code', [_c('span', {\n    staticClass: \"hljs-comment\"\n  }, [_vm._v(\"// vue-loader@13.0.0 之前\")]), _vm._v(\"\\n\"), _c('span', {\n    staticClass: \"hljs-keyword\"\n  }, [_vm._v(\"const\")]), _vm._v(\" Foo = \"), _c('span', {\n    staticClass: \"hljs-function\"\n  }, [_c('span', {\n    staticClass: \"hljs-params\"\n  }, [_vm._v(\"()\")]), _vm._v(\" =>\")]), _vm._v(\" \"), _c('span', {\n    staticClass: \"hljs-keyword\"\n  }, [_vm._v(\"import\")]), _vm._v(\"(\"), _c('span', {\n    staticClass: \"hljs-string\"\n  }, [_vm._v(\"'./Foo.vue'\")]), _vm._v(\") \"), _c('span', {\n    staticClass: \"hljs-comment\"\n  }, [_vm._v(\"// 在 Vue 2.4 + vue-router 2.7 版本下可以正确运行\")]), _vm._v(\"\\n\\n\"), _c('span', {\n    staticClass: \"hljs-comment\"\n  }, [_vm._v(\"// vue-loader@13.0.0\")]), _vm._v(\"\\n\"), _c('span', {\n    staticClass: \"hljs-keyword\"\n  }, [_vm._v(\"const\")]), _vm._v(\" Foo = \"), _c('span', {\n    staticClass: \"hljs-function\"\n  }, [_c('span', {\n    staticClass: \"hljs-params\"\n  }, [_vm._v(\"()\")]), _vm._v(\" =>\")]), _vm._v(\" \"), _c('span', {\n    staticClass: \"hljs-keyword\"\n  }, [_vm._v(\"import\")]), _vm._v(\"(\"), _c('span', {\n    staticClass: \"hljs-string\"\n  }, [_vm._v(\"'./Foo.vue'\")]), _vm._v(\").then(\"), _c('span', {\n    staticClass: \"hljs-function\"\n  }, [_c('span', {\n    staticClass: \"hljs-params\"\n  }, [_vm._v(\"m\")]), _vm._v(\" =>\")]), _vm._v(\" m.default)\\n\")])]), _vm._v(\" \"), _c('h2', [_vm._v(\"组件打包问题\")]), _vm._v(\" \"), _c('p', [_vm._v(\"如果你在不同的进行了代码分割的 .vue 文件引入了相同的组件，在打包时两个路由的代码都会重复打包该组件。\")]), _vm._v(\" \"), _c('p', [_vm._v(\"你可以对重复使用的组件在 \"), _c('code', [_vm._v(\"main.js\")]), _vm._v(\" 进行全局注册，以减少相应 chunk file 的大小并提高下载速度。\")])])\n}]}\nmodule.exports.render._withStripped = true\nif (module.hot) {\n  module.hot.accept()\n  if (module.hot.data) {\n     require(\"vue-hot-reload-api\").rerender(\"data-v-4120d964\", module.exports)\n  }\n}\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./~/ream/~/vue-loader/lib/template-compiler?{\"id\":\"data-v-4120d964\"}!./~/ream/~/vue-loader/lib/selector.js?type=template&index=0!./~/v-markdown-loader/_cache/vue-webpack-code-splitting-async-171.vue\n// module id = 2666\n// module chunks = 217","module.exports = require(\"!!vue-loader!../../node_modules/v-markdown-loader/_cache/vue-webpack-code-splitting-async-171.vue\");\n\n\n//////////////////\n// WEBPACK FOOTER\n// ./en/development/vue-webpack-code-splitting-async.md\n// module id = 579\n// module chunks = 217"],"sourceRoot":""}