cube-ui—安装
1.cube-ui介绍 滴滴团队、Vue、移动端、组件库 2.基于Vue-cli3.0, cube-ui开发了vue-cli-plugin-cube-ui插件 3. 安装插件vue add cube-ui4.预设Use post-compile?// 是否使用后编译(推荐选择是)// 后编译只不去使用编译后的代码,直接引用源码,用应用去编...
·
1.cube-ui介绍
滴滴团队、Vue、移动端、组件库
2.基于Vue-cli3.0, cube-ui开发了vue-cli-plugin-cube-ui插件
3. 安装插件
vue add cube-ui
4.预设
Use post-compile? // 是否使用后编译(推荐选择是)
// 后编译只不去使用编译后的代码,直接引用源码,用应用去编译这块代码。
// 后编译的优点是减少构建包的体积。
partly, import component on demand, which makes the size of imported code lighter
// 按需引用组件 (推荐)
fully, import all the compoents
// 全部引用组件
Custom theme? // 自定义主题(推荐)
Use rem layout // 是否使用rem布局
Use vw layout // 是否使用vm布局
5. 安装完成之后
新增文件及修改文件
src/cube-ui.js // 引入所有的组件,根据自己的需要手动删除不需要的组件
src/theme.styl // 列出所有组件的颜色,根据需求把颜色进行修改
vue.config.js // 额外的配置,可以给webpack做额外的配置。
// 对应cube-ui而言, 对css进行额外的配置,以及添加postCompile插件
.browserslistrc // 针对移动端进行配置修改
package-lock.json
package.json // 添加了"transformModules"字段
"transformModules": {
"cube-ui": {
"transform": "cube-ui/src/modules/${member}",
"kebabCase": true
}
}
// 配置此项内容,把cube-ui的组件当做项目的组件直接引用,然后交于项目去编译,这就是所谓的后编译,打包后项目体积会大大减少
src/main.js // 引入cube-ui
更多推荐
已为社区贡献13条内容
所有评论(0)