提交 9ffb465d 编写于 作者: D dolymood

build: docs

上级 35a5f12e
<!DOCTYPE html><html><head><meta charset=UTF-8><title>cube-ui lib</title><meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover"><link rel="shortcut icon" type=images/x-icon href=//webapp.didistatic.com/static/webapp/shield/Cube-UI_logo.ico><link href=css/app.d4e1f924850cdf15c5468a3d5ade2b63.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=js/manifest.346dd10710fe9c0348bf.js></script><script type=text/javascript src=js/vendor.7a09809d80067f7ce423.js></script><script type=text/javascript src=js/app.cce38e8d133e0533eefe.js></script></body></html>
\ No newline at end of file
<!DOCTYPE html><html><head><meta charset=UTF-8><title>cube-ui lib</title><meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no,viewport-fit=cover"><link rel="shortcut icon" type=images/x-icon href=//webapp.didistatic.com/static/webapp/shield/Cube-UI_logo.ico><link href=css/app.d4e1f924850cdf15c5468a3d5ade2b63.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=js/manifest.346dd10710fe9c0348bf.js></script><script type=text/javascript src=js/vendor.29d03d871a4abe1d7f9b.js></script><script type=text/javascript src=js/app.030ccfc0ce0c15893885.js></script></body></html>
\ No newline at end of file
<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"><meta name=x5-cache content=disable><meta name=keywords content=CUBE,UI,VUE,COMPONENT,LIB,LIBRARY><link rel="shortcut icon" type=images/x-icon href=//webapp.didistatic.com/static/webapp/shield/Cube-UI_logo.ico><title>cube-ui Document</title><link href=/cube-ui/css/app.eff0dd361031a52994230f4aae1f87da.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=/cube-ui/js/manifest.a0ad75cf47f8debd9cf4.js></script><script type=text/javascript src=/cube-ui/js/vendor.d333162a638d46cd8472.js></script><script type=text/javascript src=/cube-ui/js/app.c3e5964c144d5c8b94dd.js></script></body></html>
\ No newline at end of file
<!DOCTYPE html><html><head><meta charset=utf-8><meta name=viewport content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no"><meta name=x5-cache content=disable><meta name=keywords content=CUBE,UI,VUE,COMPONENT,LIB,LIBRARY><link rel="shortcut icon" type=images/x-icon href=//webapp.didistatic.com/static/webapp/shield/Cube-UI_logo.ico><title>cube-ui Document</title><link href=/cube-ui/css/app.eff0dd361031a52994230f4aae1f87da.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=/cube-ui/js/manifest.0365f81a029932b5c093.js></script><script type=text/javascript src=/cube-ui/js/vendor.d333162a638d46cd8472.js></script><script type=text/javascript src=/cube-ui/js/app.c3e5964c144d5c8b94dd.js></script></body></html>
\ No newline at end of file
webpackJsonp([25],{"+Ndq":function(s,t,a){var r=a("VU/8")(null,a("z62X"),null,null,null);s.exports=r.exports},"8XCF":function(s,t,a){s.exports=a("+Ndq")},z62X:function(s,t){s.exports={render:function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("section",[a("h2",{attrs:{id:"快速上手"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-快速上手-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 快速上手")]),s._v(" "),s._m(0),s._v(" "),a("h3",{attrs:{id:"脚手架"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-脚手架-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 脚手架")]),s._v(" "),a("h4",{attrs:{id:"vue-cli>=3"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-vue-cli>=3-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" vue-cli >= 3")]),s._v(" "),s._m(1),s._v(" "),s._m(2),s._v(" "),s._m(3),s._v(" "),a("h4",{attrs:{id:"vue-cli<3"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-vue-cli<3-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" vue-cli < 3")]),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),s._m(6),s._v(" "),s._m(7),s._v(" "),a("h3",{attrs:{id:"安装"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-安装-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 安装")]),s._v(" "),s._m(8),s._v(" "),a("h4",{attrs:{id:"NPM"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-NPM-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" NPM")]),s._v(" "),s._m(9),s._v(" "),s._m(10),s._v(" "),s._m(11),s._v(" "),a("h4",{attrs:{id:"CDN"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-CDN-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" CDN")]),s._v(" "),s._m(12),s._v(" "),a("h3",{attrs:{id:"使用"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-使用-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 使用")]),s._v(" "),a("h4",{attrs:{id:"全部引入"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-全部引入-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 全部引入")]),s._v(" "),a("p",[s._v("一般在入口文件中:")]),s._v(" "),s._m(13),s._v(" "),a("h4",{attrs:{id:"按需引入"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-按需引入-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 按需引入")]),s._v(" "),s._m(14),s._v(" "),s._m(15),s._v(" "),a("p",[s._v("我们推荐直接全局注册:")]),s._v(" "),s._m(16),s._v(" "),a("p",[s._v("所有的可按需引入的组件以及模块:")]),s._v(" "),s._m(17),s._v(" "),s._m(18),s._v(" "),s._m(19),s._v(" "),a("h4",{attrs:{id:"示例"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-示例-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 示例")]),s._v(" "),s._m(20)])},staticRenderFns:[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[s._v("新手教程项目:"),a("a",{attrs:{href:"https://github.com/cube-ui/cube-application-guide"}},[s._v("cube-application-guide")])]),s._v(" "),a("li",[s._v("遇到问题,先移步 "),a("a",{attrs:{href:"https://github.com/cube-ui/question-answer/issues"}},[s._v("QA")])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("如果你正在使用新版本的 Vue CLI vue-cli@3,那么推荐你直接使用 "),a("a",{attrs:{href:"https://github.com/cube-ui/vue-cli-plugin-cube-ui"}},[s._v("vue-cli-plugin-cube-ui")]),s._v(" 插件。在你初始化完项目后直接执行 "),a("code",{pre:!0},[s._v("vue add cube-ui")]),s._v(" 即可。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("在执行的时候,会询问一些配置项,这个和老版本的 "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template"}},[s._v("模板")]),s._v(" 配置是一样的,参见 "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template/wiki"}},[s._v("cube-template WIKI")]),s._v("")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("执行完成后,你可以直接进入"),a("a",{staticClass:"anchor",attrs:{href:"#cube-使用-anchor"}},[s._v("使用部分")]),s._v("")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("如果你打算用在一个新项目中使用 cube-ui,可以通过我们提供的一套基于 "),a("a",{attrs:{href:"https://github.com/vuejs/vue-cli"}},[s._v("vue-cli")]),s._v(" 实现的"),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template"}},[s._v("脚手架模板")]),s._v("去初始化 cube-ui 项目的配置和基础代码,这样你就可以忽略"),a("a",{staticClass:"anchor",attrs:{href:"#cube-安装-anchor"}},[s._v("安装")]),s._v("步骤,直接看"),a("a",{staticClass:"anchor",attrs:{href:"#cube-使用-anchor"}},[s._v("使用部分")]),s._v("")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-shell"}},[a("span",{attrs:{class:"hljs-meta"}},[s._v("$")]),a("span",{attrs:{class:"bash"}},[s._v(" vue init cube-ui/cube-template projectname")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("关于初始化时特殊的配置项,请参考 "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template/wiki"}},[s._v("cube-template WIKI")]),s._v("")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("如果你打算在现有项目中使用 cube-ui,请先参考"),a("a",{staticClass:"anchor",attrs:{href:"#cube-安装-anchor"}},[s._v("安装")]),s._v("部分。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("blockquote",[a("p",[s._v("此安装部分只针对于 vue-cli < 3 的情况")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-shell"}},[a("span",{attrs:{class:"hljs-meta"}},[s._v("$")]),a("span",{attrs:{class:"bash"}},[s._v(" npm install cube-ui --save")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("cube-ui 搭配 webpack 2+ 支持"),a("a",{attrs:{href:"#/zh-CN/docs/post-compile"}},[s._v("后编译")]),s._v("和普通编译 2 种构建方式(默认使用后编译),使用前都需要修改应用的依赖和配置。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("p",[s._v("后编译")]),s._v(" "),a("ol",[a("li",[s._v("修改 package.json 并安装依赖")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n // webpack-transform-modules-plugin 依赖 transformModules\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transformModules"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transform"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui/src/modules/${member}"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"kebabCase"')]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n // 新增 stylus 相关依赖\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"stylus"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.54.5"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"stylus-loader"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^2.1.1"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-post-compile-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^1.0.0"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-transform-modules-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.4.3"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("修改 webpack.base.conf.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" PostCompilePlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-post-compile-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" TransformModulesPlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-transform-modules-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n plugins: [\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" PostCompilePlugin(),\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" TransformModulesPlugin()\n ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"3"}},[a("li",[s._v("修改 build/utils.js 中的 "),a("code",{pre:!0},[s._v("exports.cssLoaders")]),s._v(" 函数")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("exports.cssLoaders = "),a("span",{attrs:{class:"hljs-function"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" ("),a("span",{attrs:{class:"hljs-params"}},[s._v("options")]),s._v(") ")]),s._v("{\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" stylusOptions = {\n "),a("span",{attrs:{class:"hljs-string"}},[s._v("'resolve url'")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// https://vue-loader.vuejs.org/en/configurations/extract-css.html")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("css")]),s._v(": generateLoaders(),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("postcss")]),s._v(": generateLoaders(),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("less")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'less'")]),s._v("),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("sass")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v(", { "),a("span",{attrs:{class:"hljs-attr"}},[s._v("indentedSyntax")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(" }),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("scss")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v("),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("stylus")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(", stylusOptions),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("styl")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(", stylusOptions)\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"4"}},[a("li",[s._v("修改 vue-loader.conf.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("loaders")]),s._v(": utils.cssLoaders({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": sourceMapEnabled,\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("extract")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("false")]),s._v("\n }),\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])]),s._v(" "),a("p",[s._v("具体参见 "),a("a",{attrs:{href:"https://github.com/vuejs-templates/webpack/pull/970/files"}},[s._v("https://github.com/vuejs-templates/webpack/pull/970/files")])])]),s._v(" "),a("li",[a("p",[s._v("普通编译")]),s._v(" "),a("ol",[a("li",[s._v("修改 package.json 并安装依赖")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n // webpack-transform-modules-plugin 依赖 transformModules\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transformModules"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transform"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui/lib/${member}"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"kebabCase"')]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"style"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"ignore"')]),s._v(": ["),a("span",{attrs:{class:"hljs-string"}},[s._v('"create-api"')]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v('"better-scroll"')]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v('"locale"')]),s._v("]\n }\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-transform-modules-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.4.3"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("修改 webpack 配置:")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// webpack.config.js")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" TransformModulesPlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-transform-modules-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n resolve: {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n alias: {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui/lib'")]),s._v("\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n plugins: [\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" TransformModulesPlugin()\n ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("src")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"https://unpkg.com/cube-ui/lib/cube.min.js"')]),s._v(">")]),a("span",{attrs:{class:"undefined"}}),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("link")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rel")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"stylesheet"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("href")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"https://unpkg.com/cube-ui/lib/cube.min.css"')]),s._v(">")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" Vue "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'vue'")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" Cube "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n\nVue.use(Cube)\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("/* eslint-disable no-unused-vars */")]),s._v("\n Style,\n Button\n} "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[a("strong",[s._v("注意:")]),s._v(" 按需引入的话,是不会打包"),a("a",{attrs:{href:"#/zh-CN/docs/style"}},[s._v("基础样式")]),s._v("部分的,所以在使用的时候需要引入 style 模块。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// 全局注册")]),s._v("\nVue.use(Button)\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// 基础样式")]),s._v("\n Style,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// basic")]),s._v("\n Button,\n Loading,\n Tip,\n Toolbar,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// form")]),s._v("\n Checkbox,\n CheckboxGroup,\n Radio,\n Checker,\n Input,\n Textarea,\n Select,\n Switch,\n Rate,\n Validator,\n Upload,\n Form,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// popup")]),s._v("\n Popup,\n Toast,\n Picker,\n CascadePicker,\n DatePicker,\n TimePicker,\n SegmentPicker,\n Dialog,\n ActionSheet,\n Drawer,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// scroll")]),s._v("\n Scroll,\n Slide,\n IndexList,\n Swipe\n} "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("也可以引入"),a("a",{attrs:{href:"#/zh-CN/docs/create-api"}},[s._v("create-api")]),s._v(""),a("a",{attrs:{href:"#/zh-CN/docs/better-scroll"}},[s._v("better-scroll")]),s._v("模块:")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" { createAPI, BetterScroll, Locale } "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@click")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"showDialog"')]),s._v(">")]),s._v("show dialog"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("template")]),s._v(">")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),a("span",{attrs:{class:"javascript"}},[s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("export")]),s._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n showDialog() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".$createDialog({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'alert'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("title")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Alert'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("content")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'dialog content'")]),s._v("\n }).show()\n }\n }\n }\n")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),s._v("\n")])])}]}}});
\ No newline at end of file
webpackJsonp([25],{"+Ndq":function(s,t,a){var r=a("VU/8")(null,a("z62X"),null,null,null);s.exports=r.exports},"8XCF":function(s,t,a){s.exports=a("+Ndq")},z62X:function(s,t){s.exports={render:function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("section",[a("h2",{attrs:{id:"快速上手"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-快速上手-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 快速上手")]),s._v(" "),s._m(0),s._v(" "),a("h3",{attrs:{id:"脚手架"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-脚手架-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 脚手架")]),s._v(" "),a("h4",{attrs:{id:"vue-cli>=3"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-vue-cli>=3-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" vue-cli >= 3")]),s._v(" "),s._m(1),s._v(" "),s._m(2),s._v(" "),s._m(3),s._v(" "),a("h4",{attrs:{id:"vue-cli<3"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-vue-cli<3-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" vue-cli < 3")]),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),s._m(6),s._v(" "),s._m(7),s._v(" "),a("h3",{attrs:{id:"安装"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-安装-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 安装")]),s._v(" "),s._m(8),s._v(" "),a("h4",{attrs:{id:"NPM"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-NPM-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" NPM")]),s._v(" "),s._m(9),s._v(" "),s._m(10),s._v(" "),s._m(11),s._v(" "),a("h4",{attrs:{id:"CDN"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-CDN-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" CDN")]),s._v(" "),s._m(12),s._v(" "),a("h3",{attrs:{id:"使用"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-使用-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 使用")]),s._v(" "),a("h4",{attrs:{id:"全部引入"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-全部引入-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 全部引入")]),s._v(" "),a("p",[s._v("一般在入口文件中:")]),s._v(" "),s._m(13),s._v(" "),a("h4",{attrs:{id:"按需引入"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-按需引入-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 按需引入")]),s._v(" "),s._m(14),s._v(" "),s._m(15),s._v(" "),a("p",[s._v("我们推荐直接全局注册:")]),s._v(" "),s._m(16),s._v(" "),a("p",[s._v("所有的可按需引入的组件以及模块:")]),s._v(" "),s._m(17),s._v(" "),s._m(18),s._v(" "),s._m(19),s._v(" "),a("h4",{attrs:{id:"示例"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-示例-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 示例")]),s._v(" "),s._m(20)])},staticRenderFns:[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[s._v("新手教程项目:"),a("a",{attrs:{href:"https://github.com/cube-ui/cube-application-guide"}},[s._v("cube-application-guide")])]),s._v(" "),a("li",[s._v("遇到问题,先移步 "),a("a",{attrs:{href:"https://github.com/cube-ui/question-answer/issues"}},[s._v("QA")])]),s._v(" "),a("li",[s._v("使用 nuxt,请参考"),a("a",{attrs:{href:"https://github.com/cube-ui/cube-nuxt-demo"}},[s._v("示例仓库")])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("如果你正在使用新版本的 Vue CLI vue-cli@3,那么推荐你直接使用 "),a("a",{attrs:{href:"https://github.com/cube-ui/vue-cli-plugin-cube-ui"}},[s._v("vue-cli-plugin-cube-ui")]),s._v(" 插件。在你初始化完项目后直接执行 "),a("code",{pre:!0},[s._v("vue add cube-ui")]),s._v(" 即可。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("在执行的时候,会询问一些配置项,这个和老版本的 "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template"}},[s._v("模板")]),s._v(" 配置是一样的,参见 "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template/wiki"}},[s._v("cube-template WIKI")]),s._v("")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("执行完成后,你可以直接进入"),a("a",{staticClass:"anchor",attrs:{href:"#cube-使用-anchor"}},[s._v("使用部分")]),s._v("")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("如果你打算用在一个新项目中使用 cube-ui,可以通过我们提供的一套基于 "),a("a",{attrs:{href:"https://github.com/vuejs/vue-cli"}},[s._v("vue-cli")]),s._v(" 实现的"),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template"}},[s._v("脚手架模板")]),s._v("去初始化 cube-ui 项目的配置和基础代码,这样你就可以忽略"),a("a",{staticClass:"anchor",attrs:{href:"#cube-安装-anchor"}},[s._v("安装")]),s._v("步骤,直接看"),a("a",{staticClass:"anchor",attrs:{href:"#cube-使用-anchor"}},[s._v("使用部分")]),s._v("")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-shell"}},[a("span",{attrs:{class:"hljs-meta"}},[s._v("$")]),a("span",{attrs:{class:"bash"}},[s._v(" vue init cube-ui/cube-template projectname")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("关于初始化时特殊的配置项,请参考 "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template/wiki"}},[s._v("cube-template WIKI")]),s._v("")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("如果你打算在现有项目中使用 cube-ui,请先参考"),a("a",{staticClass:"anchor",attrs:{href:"#cube-安装-anchor"}},[s._v("安装")]),s._v("部分。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("blockquote",[a("p",[s._v("此安装部分只针对于 vue-cli < 3 的情况")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-shell"}},[a("span",{attrs:{class:"hljs-meta"}},[s._v("$")]),a("span",{attrs:{class:"bash"}},[s._v(" npm install cube-ui --save")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("cube-ui 搭配 webpack 2+ 支持"),a("a",{attrs:{href:"#/zh-CN/docs/post-compile"}},[s._v("后编译")]),s._v("和普通编译 2 种构建方式(默认使用后编译),使用前都需要修改应用的依赖和配置。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("p",[s._v("后编译")]),s._v(" "),a("ol",[a("li",[s._v("修改 package.json 并安装依赖")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n // webpack-transform-modules-plugin 依赖 transformModules\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transformModules"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transform"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui/src/modules/${member}"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"kebabCase"')]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n // 新增 stylus 相关依赖\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"stylus"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.54.5"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"stylus-loader"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^2.1.1"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-post-compile-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^1.0.0"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-transform-modules-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.4.3"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("修改 webpack.base.conf.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" PostCompilePlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-post-compile-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" TransformModulesPlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-transform-modules-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n plugins: [\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" PostCompilePlugin(),\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" TransformModulesPlugin()\n ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"3"}},[a("li",[s._v("修改 build/utils.js 中的 "),a("code",{pre:!0},[s._v("exports.cssLoaders")]),s._v(" 函数")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("exports.cssLoaders = "),a("span",{attrs:{class:"hljs-function"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" ("),a("span",{attrs:{class:"hljs-params"}},[s._v("options")]),s._v(") ")]),s._v("{\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" stylusOptions = {\n "),a("span",{attrs:{class:"hljs-string"}},[s._v("'resolve url'")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// https://vue-loader.vuejs.org/en/configurations/extract-css.html")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("css")]),s._v(": generateLoaders(),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("postcss")]),s._v(": generateLoaders(),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("less")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'less'")]),s._v("),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("sass")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v(", { "),a("span",{attrs:{class:"hljs-attr"}},[s._v("indentedSyntax")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(" }),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("scss")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v("),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("stylus")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(", stylusOptions),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("styl")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(", stylusOptions)\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"4"}},[a("li",[s._v("修改 vue-loader.conf.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("loaders")]),s._v(": utils.cssLoaders({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": sourceMapEnabled,\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("extract")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("false")]),s._v("\n }),\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])]),s._v(" "),a("p",[s._v("具体参见 "),a("a",{attrs:{href:"https://github.com/vuejs-templates/webpack/pull/970/files"}},[s._v("https://github.com/vuejs-templates/webpack/pull/970/files")])])]),s._v(" "),a("li",[a("p",[s._v("普通编译")]),s._v(" "),a("ol",[a("li",[s._v("修改 package.json 并安装依赖")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n // webpack-transform-modules-plugin 依赖 transformModules\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transformModules"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transform"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui/lib/${member}"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"kebabCase"')]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"style"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"ignore"')]),s._v(": ["),a("span",{attrs:{class:"hljs-string"}},[s._v('"create-api"')]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v('"better-scroll"')]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v('"locale"')]),s._v("]\n }\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-transform-modules-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.4.3"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("修改 webpack 配置:")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// webpack.config.js")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" TransformModulesPlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-transform-modules-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n resolve: {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n alias: {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui/lib'")]),s._v("\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n plugins: [\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" TransformModulesPlugin()\n ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("src")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"https://unpkg.com/cube-ui/lib/cube.min.js"')]),s._v(">")]),a("span",{attrs:{class:"undefined"}}),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("link")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rel")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"stylesheet"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("href")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"https://unpkg.com/cube-ui/lib/cube.min.css"')]),s._v(">")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" Vue "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'vue'")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" Cube "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n\nVue.use(Cube)\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("/* eslint-disable no-unused-vars */")]),s._v("\n Style,\n Button\n} "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[a("strong",[s._v("注意:")]),s._v(" 按需引入的话,是不会打包"),a("a",{attrs:{href:"#/zh-CN/docs/style"}},[s._v("基础样式")]),s._v("部分的,所以在使用的时候需要引入 style 模块。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// 全局注册")]),s._v("\nVue.use(Button)\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// 基础样式")]),s._v("\n Style,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// basic")]),s._v("\n Button,\n Loading,\n Tip,\n Toolbar,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// form")]),s._v("\n Checkbox,\n CheckboxGroup,\n Radio,\n Checker,\n Input,\n Textarea,\n Select,\n Switch,\n Rate,\n Validator,\n Upload,\n Form,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// popup")]),s._v("\n Popup,\n Toast,\n Picker,\n CascadePicker,\n DatePicker,\n TimePicker,\n SegmentPicker,\n Dialog,\n ActionSheet,\n Drawer,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// scroll")]),s._v("\n Scroll,\n Slide,\n IndexList,\n Swipe\n} "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("也可以引入"),a("a",{attrs:{href:"#/zh-CN/docs/create-api"}},[s._v("create-api")]),s._v(""),a("a",{attrs:{href:"#/zh-CN/docs/better-scroll"}},[s._v("better-scroll")]),s._v("模块:")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" { createAPI, BetterScroll, Locale } "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@click")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"showDialog"')]),s._v(">")]),s._v("show dialog"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("template")]),s._v(">")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),a("span",{attrs:{class:"javascript"}},[s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("export")]),s._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n showDialog() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".$createDialog({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'alert'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("title")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Alert'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("content")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'dialog content'")]),s._v("\n }).show()\n }\n }\n }\n")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),s._v("\n")])])}]}}});
\ No newline at end of file
webpackJsonp([70],{"10ZE":function(s,t){s.exports={render:function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("section",[a("h2",{attrs:{id:"Quickstart"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Quickstart-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Quick start")]),s._v(" "),s._m(0),s._v(" "),a("h3",{attrs:{id:"CLI"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-CLI-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" CLI")]),s._v(" "),a("h4",{attrs:{id:"vue-cli>=3"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-vue-cli>=3-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" vue-cli >= 3")]),s._v(" "),s._m(1),s._v(" "),s._m(2),s._v(" "),a("h4",{attrs:{id:"vue-cli<3"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-vue-cli<3-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" vue-cli < 3")]),s._v(" "),s._m(3),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),s._m(6),s._v(" "),a("h3",{attrs:{id:"Install"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Install-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Install")]),s._v(" "),s._m(7),s._v(" "),a("h4",{attrs:{id:"NPM"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-NPM-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" NPM")]),s._v(" "),s._m(8),s._v(" "),a("p",[s._v("Since cube-ui support two compile ways such as [post-compile] (#/en-US/docs/post-compile) and normal compile with webpack 2+(by default using post-compile), you need to modify your application's dependencies and configuration before using it.")]),s._v(" "),s._m(9),s._v(" "),a("h4",{attrs:{id:"CDN"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-CDN-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" CDN")]),s._v(" "),s._m(10),s._v(" "),a("h3",{attrs:{id:"Usage"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Usage-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Usage")]),s._v(" "),a("h4",{attrs:{id:"Fullyimport"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Fullyimport-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Fully import")]),s._v(" "),a("p",[s._v("Commonly in the entry file:")]),s._v(" "),s._m(11),s._v(" "),a("h4",{attrs:{id:"Importondemand"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Importondemand-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Import on demand")]),s._v(" "),s._m(12),s._v(" "),s._m(13),s._v(" "),a("p",[s._v("Then register globally:")]),s._v(" "),s._m(14),s._v(" "),a("p",[s._v("All the components and modules that can be imported on demand are listed below:")]),s._v(" "),s._m(15),s._v(" "),s._m(16),s._v(" "),s._m(17),s._v(" "),a("h4",{attrs:{id:"Examples"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Examples-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Examples")]),s._v(" "),s._m(18)])},staticRenderFns:[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("a",{attrs:{href:"https://github.com/cube-ui/cube-application-guide"}},[s._v("Application Guide")])]),s._v(" "),a("li",[s._v("Have problems? See "),a("a",{attrs:{href:"https://github.com/cube-ui/question-answer/issues"}},[s._v("QA")])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("If you are using vue-cli@3, you can use "),a("a",{attrs:{href:"https://github.com/cube-ui/vue-cli-plugin-cube-ui"}},[s._v("vue-cli-plugin-cube-ui")]),s._v(" plugin. After you inited your project, just run "),a("code",{pre:!0},[s._v("vue add cube-ui")]),s._v(". About options, see "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template/wiki"}},[s._v("cube-template WIKI")]),s._v(".")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("Then you can see the "),a("a",{staticClass:"anchor",attrs:{href:"#cube-Usage-anchor"}},[s._v("Usage")]),s._v(" part directly.")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("If you are going to create a new project with cube-ui, use the "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template"}},[s._v("cli tools")]),s._v(" base on "),a("a",{attrs:{href:"https://github.com/vuejs/vue-cli"}},[s._v("vue-cli")]),s._v(" to init the config and base code, then you can ignore the "),a("a",{staticClass:"anchor",attrs:{href:"#cube-Install-anchor"}},[s._v("Install")]),s._v(" steps and see the "),a("a",{staticClass:"anchor",attrs:{href:"#cube-Usage-anchor"}},[s._v("Usage")]),s._v(" part directly.")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-shell"}},[a("span",{attrs:{class:"hljs-meta"}},[s._v("$")]),a("span",{attrs:{class:"bash"}},[s._v(" vue init cube-ui/cube-template projectname")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("About cube-template special options: "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template/wiki"}},[s._v("cube-template WIKI")]),s._v(".")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("If you are going to use cube-ui in an existing project, see the "),a("a",{staticClass:"anchor",attrs:{href:"#cube-Install-anchor"}},[s._v("Install")]),s._v(" part first.")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("blockquote",[a("p",[s._v("This section only used in the case of vue-cli < 3")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-shell"}},[a("span",{attrs:{class:"hljs-meta"}},[s._v("$")]),a("span",{attrs:{class:"bash"}},[s._v(" npm install cube-ui --save")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("p",[s._v("post-compile")]),s._v(" "),a("ol",[a("li",[s._v("Modify package.json and install the dependencies")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n // webpack-transform-modules-plugin depends on transformModules\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transformModules"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transform"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui/src/modules/${member}"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"kebabCase"')]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n // add stylus dependencies\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"stylus"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.54.5"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"stylus-loader"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^2.1.1"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-post-compile-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^1.0.0"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-transform-modules-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.4.3"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("Modify webpack.base.conf.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" PostCompilePlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-post-compile-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" TransformModulesPlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-transform-modules-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n plugins: [\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" PostCompilePlugin(),\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" TransformModulesPlugin()\n ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"3"}},[a("li",[s._v("Modify "),a("code",{pre:!0},[s._v("exports.cssLoaders")]),s._v(" function in build/utils.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("exports.cssLoaders = "),a("span",{attrs:{class:"hljs-function"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" ("),a("span",{attrs:{class:"hljs-params"}},[s._v("options")]),s._v(") ")]),s._v("{\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" stylusOptions = {\n "),a("span",{attrs:{class:"hljs-string"}},[s._v("'resolve url'")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// https://vue-loader.vuejs.org/en/configurations/extract-css.html")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("css")]),s._v(": generateLoaders(),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("postcss")]),s._v(": generateLoaders(),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("less")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'less'")]),s._v("),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("sass")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v(", { "),a("span",{attrs:{class:"hljs-attr"}},[s._v("indentedSyntax")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(" }),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("scss")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v("),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("stylus")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(", stylusOptions),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("styl")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(", stylusOptions)\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"4"}},[a("li",[s._v("Modify vue-loader.conf.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("loaders")]),s._v(": utils.cssLoaders({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": sourceMapEnabled,\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("extract")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("false")]),s._v("\n }),\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n\n")])]),s._v(" "),a("p",[s._v("See "),a("a",{attrs:{href:"https://github.com/vuejs-templates/webpack/pull/970/files"}},[s._v("https://github.com/vuejs-templates/webpack/pull/970/files")])])]),s._v(" "),a("li",[a("p",[s._v("Normal compile")]),s._v(" "),a("ol",[a("li",[s._v("Modify package.json and install the dependencies")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n // webpack-transform-modules-plugin depends on transformModules\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transformModules"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transform"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui/lib/${member}"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"kebabCase"')]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"style"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"ignore"')]),s._v(": ["),a("span",{attrs:{class:"hljs-string"}},[s._v('"create-api"')]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v('"better-scroll"')]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v('"locale"')]),s._v("]\n }\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-transform-modules-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.4.3"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("Modify webpack config")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// webpack.config.js")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" TransformModulesPlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-transform-modules-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n resolve: {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n alias: {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui/lib'")]),s._v("\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n plugins: [\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" TransformModulesPlugin()\n ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("src")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"https://unpkg.com/cube-ui/lib/cube.min.js"')]),s._v(">")]),a("span",{attrs:{class:"undefined"}}),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("link")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rel")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"stylesheet"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("href")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"https://unpkg.com/cube-ui/lib/cube.min.css"')]),s._v(">")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" Vue "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'vue'")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" Cube "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n\nVue.use(Cube)\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("/* eslint-disable no-unused-vars */")]),s._v("\n Style,\n Button\n} "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[a("strong",[s._v("Notice:")]),s._v(" In this case, you also need to import "),a("a",{attrs:{href:"#/en-US/docs/style"}},[s._v("style module")]),s._v(".")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// register globally")]),s._v("\nVue.use(Button)\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// basic style")]),s._v("\n Style,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// basic")]),s._v("\n Button,\n Loading,\n Tip,\n Toolbar,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// form")]),s._v("\n Checkbox,\n CheckboxGroup,\n Radio,\n Checker,\n Input,\n Textarea,\n Select,\n Switch,\n Rate,\n Validator,\n Upload,\n Form,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// popup")]),s._v("\n Popup,\n Toast,\n Picker,\n CascadePicker,\n DatePicker,\n TimePicker,\n SegmentPicker,\n Dialog,\n ActionSheet,\n Drawer,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// scroll")]),s._v("\n Scroll,\n Slide,\n IndexList,\n Swipe\n} "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("You can also import "),a("a",{attrs:{href:"#/en-US/docs/create-api"}},[s._v("create-api")]),s._v(" and "),a("a",{attrs:{href:"#/en-US/docs/better-scroll"}},[s._v("better-scroll")]),s._v(" module:")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" { createAPI, BetterScroll, Locale } "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@click")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"showDialog"')]),s._v(">")]),s._v("show dialog"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("template")]),s._v(">")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),a("span",{attrs:{class:"javascript"}},[s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("export")]),s._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n showDialog() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".$createDialog({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'alert'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("title")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Alert'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("content")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'dialog content'")]),s._v("\n }).show()\n }\n }\n }\n")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),s._v("\n")])])}]}},LsOJ:function(s,t,a){var e=a("VU/8")(null,a("10ZE"),null,null,null);s.exports=e.exports},gyX9:function(s,t,a){s.exports=a("LsOJ")}});
\ No newline at end of file
webpackJsonp([70],{"10ZE":function(s,t){s.exports={render:function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("section",[a("h2",{attrs:{id:"Quickstart"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Quickstart-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Quick start")]),s._v(" "),s._m(0),s._v(" "),a("h3",{attrs:{id:"CLI"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-CLI-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" CLI")]),s._v(" "),a("h4",{attrs:{id:"vue-cli>=3"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-vue-cli>=3-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" vue-cli >= 3")]),s._v(" "),s._m(1),s._v(" "),s._m(2),s._v(" "),a("h4",{attrs:{id:"vue-cli<3"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-vue-cli<3-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" vue-cli < 3")]),s._v(" "),s._m(3),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),s._m(6),s._v(" "),a("h3",{attrs:{id:"Install"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Install-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Install")]),s._v(" "),s._m(7),s._v(" "),a("h4",{attrs:{id:"NPM"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-NPM-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" NPM")]),s._v(" "),s._m(8),s._v(" "),a("p",[s._v("Since cube-ui support two compile ways such as [post-compile] (#/en-US/docs/post-compile) and normal compile with webpack 2+(by default using post-compile), you need to modify your application's dependencies and configuration before using it.")]),s._v(" "),s._m(9),s._v(" "),a("h4",{attrs:{id:"CDN"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-CDN-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" CDN")]),s._v(" "),s._m(10),s._v(" "),a("h3",{attrs:{id:"Usage"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Usage-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Usage")]),s._v(" "),a("h4",{attrs:{id:"Fullyimport"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Fullyimport-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Fully import")]),s._v(" "),a("p",[s._v("Commonly in the entry file:")]),s._v(" "),s._m(11),s._v(" "),a("h4",{attrs:{id:"Importondemand"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Importondemand-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Import on demand")]),s._v(" "),s._m(12),s._v(" "),s._m(13),s._v(" "),a("p",[s._v("Then register globally:")]),s._v(" "),s._m(14),s._v(" "),a("p",[s._v("All the components and modules that can be imported on demand are listed below:")]),s._v(" "),s._m(15),s._v(" "),s._m(16),s._v(" "),s._m(17),s._v(" "),a("h4",{attrs:{id:"Examples"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Examples-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Examples")]),s._v(" "),s._m(18)])},staticRenderFns:[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("a",{attrs:{href:"https://github.com/cube-ui/cube-application-guide"}},[s._v("Application Guide")])]),s._v(" "),a("li",[s._v("Have problems? See "),a("a",{attrs:{href:"https://github.com/cube-ui/question-answer/issues"}},[s._v("QA")])]),s._v(" "),a("li",[s._v("In nuxt application, see "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-nuxt-demo"}},[s._v("demo repo")])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("If you are using vue-cli@3, you can use "),a("a",{attrs:{href:"https://github.com/cube-ui/vue-cli-plugin-cube-ui"}},[s._v("vue-cli-plugin-cube-ui")]),s._v(" plugin. After you inited your project, just run "),a("code",{pre:!0},[s._v("vue add cube-ui")]),s._v(". About options, see "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template/wiki"}},[s._v("cube-template WIKI")]),s._v(".")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("Then you can see the "),a("a",{staticClass:"anchor",attrs:{href:"#cube-Usage-anchor"}},[s._v("Usage")]),s._v(" part directly.")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("If you are going to create a new project with cube-ui, use the "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template"}},[s._v("cli tools")]),s._v(" base on "),a("a",{attrs:{href:"https://github.com/vuejs/vue-cli"}},[s._v("vue-cli")]),s._v(" to init the config and base code, then you can ignore the "),a("a",{staticClass:"anchor",attrs:{href:"#cube-Install-anchor"}},[s._v("Install")]),s._v(" steps and see the "),a("a",{staticClass:"anchor",attrs:{href:"#cube-Usage-anchor"}},[s._v("Usage")]),s._v(" part directly.")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-shell"}},[a("span",{attrs:{class:"hljs-meta"}},[s._v("$")]),a("span",{attrs:{class:"bash"}},[s._v(" vue init cube-ui/cube-template projectname")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("About cube-template special options: "),a("a",{attrs:{href:"https://github.com/cube-ui/cube-template/wiki"}},[s._v("cube-template WIKI")]),s._v(".")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("If you are going to use cube-ui in an existing project, see the "),a("a",{staticClass:"anchor",attrs:{href:"#cube-Install-anchor"}},[s._v("Install")]),s._v(" part first.")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("blockquote",[a("p",[s._v("This section only used in the case of vue-cli < 3")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-shell"}},[a("span",{attrs:{class:"hljs-meta"}},[s._v("$")]),a("span",{attrs:{class:"bash"}},[s._v(" npm install cube-ui --save")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("p",[s._v("post-compile")]),s._v(" "),a("ol",[a("li",[s._v("Modify package.json and install the dependencies")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n // webpack-transform-modules-plugin depends on transformModules\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transformModules"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transform"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui/src/modules/${member}"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"kebabCase"')]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n // add stylus dependencies\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"stylus"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.54.5"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"stylus-loader"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^2.1.1"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-post-compile-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^1.0.0"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-transform-modules-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.4.3"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("Modify webpack.base.conf.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" PostCompilePlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-post-compile-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" TransformModulesPlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-transform-modules-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n plugins: [\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" PostCompilePlugin(),\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" TransformModulesPlugin()\n ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"3"}},[a("li",[s._v("Modify "),a("code",{pre:!0},[s._v("exports.cssLoaders")]),s._v(" function in build/utils.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("exports.cssLoaders = "),a("span",{attrs:{class:"hljs-function"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" ("),a("span",{attrs:{class:"hljs-params"}},[s._v("options")]),s._v(") ")]),s._v("{\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" stylusOptions = {\n "),a("span",{attrs:{class:"hljs-string"}},[s._v("'resolve url'")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// https://vue-loader.vuejs.org/en/configurations/extract-css.html")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("css")]),s._v(": generateLoaders(),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("postcss")]),s._v(": generateLoaders(),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("less")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'less'")]),s._v("),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("sass")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v(", { "),a("span",{attrs:{class:"hljs-attr"}},[s._v("indentedSyntax")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(" }),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("scss")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v("),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("stylus")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(", stylusOptions),\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("styl")]),s._v(": generateLoaders("),a("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(", stylusOptions)\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"4"}},[a("li",[s._v("Modify vue-loader.conf.js")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("loaders")]),s._v(": utils.cssLoaders({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": sourceMapEnabled,\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("extract")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("false")]),s._v("\n }),\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n\n")])]),s._v(" "),a("p",[s._v("See "),a("a",{attrs:{href:"https://github.com/vuejs-templates/webpack/pull/970/files"}},[s._v("https://github.com/vuejs-templates/webpack/pull/970/files")])])]),s._v(" "),a("li",[a("p",[s._v("Normal compile")]),s._v(" "),a("ol",[a("li",[s._v("Modify package.json and install the dependencies")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n // webpack-transform-modules-plugin depends on transformModules\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transformModules"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"transform"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui/lib/${member}"')]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"kebabCase"')]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"style"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"ignore"')]),s._v(": ["),a("span",{attrs:{class:"hljs-string"}},[s._v('"create-api"')]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v('"better-scroll"')]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v('"locale"')]),s._v("]\n }\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"webpack-transform-modules-plugin"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.4.3"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("Modify webpack config")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// webpack.config.js")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" TransformModulesPlugin = "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("require")]),s._v("("),a("span",{attrs:{class:"hljs-string"}},[s._v("'webpack-transform-modules-plugin'")]),s._v(")\n"),a("span",{attrs:{class:"hljs-built_in"}},[s._v("module")]),s._v(".exports = {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n resolve: {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n alias: {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui/lib'")]),s._v("\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n }\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n plugins: [\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" TransformModulesPlugin()\n ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("src")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"https://unpkg.com/cube-ui/lib/cube.min.js"')]),s._v(">")]),a("span",{attrs:{class:"undefined"}}),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("link")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rel")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"stylesheet"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("href")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"https://unpkg.com/cube-ui/lib/cube.min.css"')]),s._v(">")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" Vue "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'vue'")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" Cube "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n\nVue.use(Cube)\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("/* eslint-disable no-unused-vars */")]),s._v("\n Style,\n Button\n} "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[a("strong",[s._v("Notice:")]),s._v(" In this case, you also need to import "),a("a",{attrs:{href:"#/en-US/docs/style"}},[s._v("style module")]),s._v(".")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// register globally")]),s._v("\nVue.use(Button)\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// basic style")]),s._v("\n Style,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// basic")]),s._v("\n Button,\n Loading,\n Tip,\n Toolbar,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// form")]),s._v("\n Checkbox,\n CheckboxGroup,\n Radio,\n Checker,\n Input,\n Textarea,\n Select,\n Switch,\n Rate,\n Validator,\n Upload,\n Form,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// popup")]),s._v("\n Popup,\n Toast,\n Picker,\n CascadePicker,\n DatePicker,\n TimePicker,\n SegmentPicker,\n Dialog,\n ActionSheet,\n Drawer,\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// scroll")]),s._v("\n Scroll,\n Slide,\n IndexList,\n Swipe\n} "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("You can also import "),a("a",{attrs:{href:"#/en-US/docs/create-api"}},[s._v("create-api")]),s._v(" and "),a("a",{attrs:{href:"#/en-US/docs/better-scroll"}},[s._v("better-scroll")]),s._v(" module:")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" { createAPI, BetterScroll, Locale } "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("from")]),s._v(" "),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-ui'")]),s._v("\n")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("template")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@click")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"showDialog"')]),s._v(">")]),s._v("show dialog"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("template")]),s._v(">")]),s._v("\n\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),a("span",{attrs:{class:"javascript"}},[s._v("\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("export")]),s._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n showDialog() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".$createDialog({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'alert'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("title")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Alert'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("content")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'dialog content'")]),s._v("\n }).show()\n }\n }\n }\n")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("script")]),s._v(">")]),s._v("\n")])])}]}},LsOJ:function(s,t,a){var e=a("VU/8")(null,a("10ZE"),null,null,null);s.exports=e.exports},gyX9:function(s,t,a){s.exports=a("LsOJ")}});
\ No newline at end of file
!function(e){function c(a){if(d[a])return d[a].exports;var b=d[a]={i:a,l:!1,exports:{}};return e[a].call(b.exports,b,b.exports,c),b.l=!0,b.exports}var a=window.webpackJsonp;window.webpackJsonp=function(d,f,n){for(var r,t,o,u=0,i=[];u<d.length;u++)t=d[u],b[t]&&i.push(b[t][0]),b[t]=0;for(r in f)Object.prototype.hasOwnProperty.call(f,r)&&(e[r]=f[r]);for(a&&a(d,f,n);i.length;)i.shift()();if(n)for(u=0;u<n.length;u++)o=c(c.s=n[u]);return o};var d={},b={94:0};c.e=function(e){function a(){r.onerror=r.onload=null,clearTimeout(t);var c=b[e];0!==c&&(c&&c[1](new Error("Loading chunk "+e+" failed.")),b[e]=void 0)}var d=b[e];if(0===d)return new Promise(function(e){e()});if(d)return d[2];var f=new Promise(function(c,a){d=b[e]=[c,a]});d[2]=f;var n=document.getElementsByTagName("head")[0],r=document.createElement("script");r.type="text/javascript",r.charset="utf-8",r.async=!0,r.timeout=12e4,c.nc&&r.setAttribute("nonce",c.nc),r.src=c.p+"js/"+e+"."+{0:"d5ce8696d7817c1ad3a3",1:"34b5857f194e5f1acfb6",2:"6e6975d6a89dd029fad4",3:"12506d2ed3caca26d9b0",4:"415f17002e53bbea6722",5:"df54f9daf110a907159b",6:"895522cc1e070b001975",7:"e73bb330f5aef30e9afc",8:"1af7a1ba5af5bb0d68b2",9:"2b406ccd63b03baac8bd",10:"96da8d597fad20262c6a",11:"03e77abfe8cc11040e9a",12:"599c6a91b0e604847757",13:"238568fdec73355962fb",14:"c3cc516b23ecc8d821aa",15:"f8a45a0f1c77686ee9c1",16:"83d41e7b1a92ce761e7d",17:"89fd481362aaa4141a73",18:"8582310842dae1c00da6",19:"1e36d1ddd1c6b9bebb6b",20:"32b5f56ad8727fdf2c25",21:"5a95626f892944ce441b",22:"acc5973de803597dd39e",23:"3ec33d6c14d434df0bf6",24:"1b24a95625428040d221",25:"932f0dcc9d233a6c7a02",26:"b7a27fb42d8f6fe3d621",27:"1a57a87827780cc93797",28:"4cd01b39b2ba9c992d4a",29:"e21d86280e771e590b54",30:"8ec0a68ed860c372e24c",31:"7e747d10562ce36435e7",32:"141982175c7333bdfed7",33:"255b64bfe77bfc84eb29",34:"f308147228341c7ab800",35:"96bd2b8ccc9b38d34df9",36:"fb32375e5a60016231d9",37:"2f930ad9e435f595720a",38:"73040cbba669c2f346ad",39:"bd87177f9e7b6aade235",40:"3b3a0e9a78a38f6a1834",41:"7c5d8496ebb8c693c291",42:"5c07fa56f6373ad8d8ec",43:"b7e8d864e0b917164d7a",44:"1cd2ce2e186059cdbab7",45:"87c8d65c6740bc8a7d62",46:"57f0bb37f13714fdb453",47:"42231fd231c11b558a59",48:"e31086d402071e4eaabe",49:"38b72731663b30ba7a14",50:"30d54e5e374954844533",51:"4157f27b05c1bcc31478",52:"eb1222bfcf0bfb35e9a5",53:"4c8a9976d3947b0b27c3",54:"1d541ace9ba0d0e70da4",55:"fb42732889ea5a34394a",56:"7f3fb816e0fe97a65fcc",57:"5927510de4d047fa05f0",58:"883f4cb21727505c6ca7",59:"88509283c0cdfd915d17",60:"77cfecda9e49bec28446",61:"222f6deb479165b9f756",62:"19d6cd6415720462ebf2",63:"ede6b3e598e961142e98",64:"5fa3654dc13ed7ce1b3f",65:"ca97241b2ab4a1cad153",66:"d06cadf3890e07a93166",67:"bded3f7b12f4ce988815",68:"13bbe9d9886bbf9a928e",69:"7fd2dbd25b3afcd18152",70:"4cfb318e40eca6562080",71:"82d94b2284e90e2de387",72:"a5addb632f9ac18563f1",73:"94cc73e7eadfd1860814",74:"327113bc80124a47eb25",75:"69206936a4c953955e84",76:"7aed29fd85396a652aec",77:"d7a37a14fe226ac7f034",78:"bed2f379132cd626dabe",79:"5e532037283568273584",80:"f16929cf75c1e486aa17",81:"59dcaffaee7b7596b8f9",82:"67c961a904ed2f52b3b7",83:"4d15621c396625719cee",84:"abe82c1b64c923ed2b19",85:"28ec757b39b8a7a933fb",86:"f749c98106f81fa78f3e",87:"33c6aefcc892bee112dd",88:"de4a916472f104f61636",89:"f10e96c58d8eb0db1c28",90:"5de2cbb333625c493adb",91:"bafce18b7db27328f409"}[e]+".js";var t=setTimeout(a,12e4);return r.onerror=r.onload=a,n.appendChild(r),f},c.m=e,c.c=d,c.d=function(e,a,d){c.o(e,a)||Object.defineProperty(e,a,{configurable:!1,enumerable:!0,get:d})},c.n=function(e){var a=e&&e.__esModule?function(){return e.default}:function(){return e};return c.d(a,"a",a),a},c.o=function(e,c){return Object.prototype.hasOwnProperty.call(e,c)},c.p="/cube-ui/",c.oe=function(e){throw console.error(e),e}}([]);
\ No newline at end of file
!function(e){function a(c){if(d[c])return d[c].exports;var b=d[c]={i:c,l:!1,exports:{}};return e[c].call(b.exports,b,b.exports,a),b.l=!0,b.exports}var c=window.webpackJsonp;window.webpackJsonp=function(d,f,n){for(var r,t,o,u=0,i=[];u<d.length;u++)t=d[u],b[t]&&i.push(b[t][0]),b[t]=0;for(r in f)Object.prototype.hasOwnProperty.call(f,r)&&(e[r]=f[r]);for(c&&c(d,f,n);i.length;)i.shift()();if(n)for(u=0;u<n.length;u++)o=a(a.s=n[u]);return o};var d={},b={94:0};a.e=function(e){function c(){r.onerror=r.onload=null,clearTimeout(t);var a=b[e];0!==a&&(a&&a[1](new Error("Loading chunk "+e+" failed.")),b[e]=void 0)}var d=b[e];if(0===d)return new Promise(function(e){e()});if(d)return d[2];var f=new Promise(function(a,c){d=b[e]=[a,c]});d[2]=f;var n=document.getElementsByTagName("head")[0],r=document.createElement("script");r.type="text/javascript",r.charset="utf-8",r.async=!0,r.timeout=12e4,a.nc&&r.setAttribute("nonce",a.nc),r.src=a.p+"js/"+e+"."+{0:"d5ce8696d7817c1ad3a3",1:"34b5857f194e5f1acfb6",2:"6e6975d6a89dd029fad4",3:"12506d2ed3caca26d9b0",4:"415f17002e53bbea6722",5:"df54f9daf110a907159b",6:"895522cc1e070b001975",7:"e73bb330f5aef30e9afc",8:"1af7a1ba5af5bb0d68b2",9:"2b406ccd63b03baac8bd",10:"96da8d597fad20262c6a",11:"03e77abfe8cc11040e9a",12:"599c6a91b0e604847757",13:"238568fdec73355962fb",14:"c3cc516b23ecc8d821aa",15:"f8a45a0f1c77686ee9c1",16:"83d41e7b1a92ce761e7d",17:"89fd481362aaa4141a73",18:"8582310842dae1c00da6",19:"1e36d1ddd1c6b9bebb6b",20:"32b5f56ad8727fdf2c25",21:"5a95626f892944ce441b",22:"acc5973de803597dd39e",23:"3ec33d6c14d434df0bf6",24:"1b24a95625428040d221",25:"47e41476d32f9fb77ed4",26:"b7a27fb42d8f6fe3d621",27:"1a57a87827780cc93797",28:"4cd01b39b2ba9c992d4a",29:"e21d86280e771e590b54",30:"8ec0a68ed860c372e24c",31:"7e747d10562ce36435e7",32:"141982175c7333bdfed7",33:"255b64bfe77bfc84eb29",34:"f308147228341c7ab800",35:"96bd2b8ccc9b38d34df9",36:"fb32375e5a60016231d9",37:"2f930ad9e435f595720a",38:"73040cbba669c2f346ad",39:"bd87177f9e7b6aade235",40:"3b3a0e9a78a38f6a1834",41:"7c5d8496ebb8c693c291",42:"5c07fa56f6373ad8d8ec",43:"b7e8d864e0b917164d7a",44:"1cd2ce2e186059cdbab7",45:"87c8d65c6740bc8a7d62",46:"57f0bb37f13714fdb453",47:"42231fd231c11b558a59",48:"e31086d402071e4eaabe",49:"38b72731663b30ba7a14",50:"30d54e5e374954844533",51:"4157f27b05c1bcc31478",52:"eb1222bfcf0bfb35e9a5",53:"4c8a9976d3947b0b27c3",54:"1d541ace9ba0d0e70da4",55:"fb42732889ea5a34394a",56:"7f3fb816e0fe97a65fcc",57:"5927510de4d047fa05f0",58:"883f4cb21727505c6ca7",59:"88509283c0cdfd915d17",60:"77cfecda9e49bec28446",61:"222f6deb479165b9f756",62:"19d6cd6415720462ebf2",63:"ede6b3e598e961142e98",64:"5fa3654dc13ed7ce1b3f",65:"ca97241b2ab4a1cad153",66:"d06cadf3890e07a93166",67:"bded3f7b12f4ce988815",68:"13bbe9d9886bbf9a928e",69:"7fd2dbd25b3afcd18152",70:"c37a95ac4f711510b925",71:"82d94b2284e90e2de387",72:"a5addb632f9ac18563f1",73:"94cc73e7eadfd1860814",74:"327113bc80124a47eb25",75:"69206936a4c953955e84",76:"7aed29fd85396a652aec",77:"d7a37a14fe226ac7f034",78:"bed2f379132cd626dabe",79:"5e532037283568273584",80:"f16929cf75c1e486aa17",81:"59dcaffaee7b7596b8f9",82:"67c961a904ed2f52b3b7",83:"4d15621c396625719cee",84:"abe82c1b64c923ed2b19",85:"28ec757b39b8a7a933fb",86:"f749c98106f81fa78f3e",87:"33c6aefcc892bee112dd",88:"de4a916472f104f61636",89:"f10e96c58d8eb0db1c28",90:"5de2cbb333625c493adb",91:"bafce18b7db27328f409"}[e]+".js";var t=setTimeout(c,12e4);return r.onerror=r.onload=c,n.appendChild(r),f},a.m=e,a.c=d,a.d=function(e,c,d){a.o(e,c)||Object.defineProperty(e,c,{configurable:!1,enumerable:!0,get:d})},a.n=function(e){var c=e&&e.__esModule?function(){return e.default}:function(){return e};return a.d(c,"a",c),c},a.o=function(e,a){return Object.prototype.hasOwnProperty.call(e,a)},a.p="/cube-ui/",a.oe=function(e){throw console.error(e),e}}([]);
\ No newline at end of file
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册