前往新版Gitcode，体验更适合开发者的 AI 搜索 >>
webpackJsonp([18],{"+Ndq":function(s,t,a){var r=a("VU/8")(null,a("TKIV"),null,null,null);s.exports=r.exports},"8XCF":function(s,t,a){s.exports=a("+Ndq")},TKIV: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(" "),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(0),s._v(" "),s._m(1),s._v(" "),s._m(2),s._v(" "),s._m(3),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:"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(4),s._v(" "),a("p",[s._v("此处需注意：不能使用 cnpm 安装，cnpm 下载的包存在路径问题。")]),s._v(" "),s._m(5),s._v(" "),s._m(6),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(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(" "),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(8),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(9),s._v(" "),s._m(10),s._v(" "),a("p",[s._v("你可以选择全局注册也可以选择局部注册：")]),s._v(" "),s._m(11),s._v(" "),a("p",[s._v("所有的可按需引入的组件：")]),s._v(" "),s._m(12),s._v(" "),s._m(13),s._v(" "),s._m(14),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(15)])},staticRenderFns:[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")])])},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("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-post-compile-plugin 依赖 compileDependencies\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"compileDependencies"')]),s._v(": ["),a("span",{attrs:{class:"hljs-string"}},[s._v('"cube-ui"')]),s._v("],\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"babel-plugin-transform-modules"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.1.0"')]),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('"^0.1.2"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("修改 .babelrc，依赖 "),a("a",{attrs:{href:"https://www.npmjs.com/package/babel-plugin-transform-modules"}},[s._v("babel-plugin-transform-modules")]),s._v("：")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"plugins"')]),s._v(": [\n ["),a("span",{attrs:{class:"hljs-string"}},[s._v('"transform-modules"')]),s._v(", {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"cube-ui"')]),s._v(": {\n // 注意: 这里的路径需要修改到 src/modules 下\n "),a("span",{attrs:{class:"hljs-string"}},[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 ]\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"3"}},[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-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 ]\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"4"}},[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:"5"}},[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\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 "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"devDependencies"')]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"babel-plugin-transform-modules"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"^0.1.0"')]),s._v("\n }\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"2"}},[a("li",[s._v("修改 .babelrc")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-json"}},[s._v("{\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v('"plugins"')]),s._v(": [\n ["),a("span",{attrs:{class:"hljs-string"}},[s._v('"transform-modules"')]),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("]\n }\n }\n }]\n ]\n}\n")])]),s._v(" "),a("ol",{attrs:{start:"3"}},[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\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}\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\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("// 或者局部注册")]),s._v("\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("// 某个组件中")]),s._v("\n{\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("components")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("CubeButton")]),s._v(": Button\n }\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-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(" {\n Button,\n Checkbox,\n CheckboxGroup,\n Loading,\n Tip,\n Popup,\n Toast,\n Picker,\n TimePicker,\n Dialog,\n ActionSheet,\n Scroll,\n Slide,\n IndexList\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 } "),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")])])}]}}});
