https://github.com/alibaba/weex-ui
weex初始環(huán)境搭建的官方命令瘪弓，挺好使的
brew install node
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install -g weex-toolkit@latest
使用weex-ui條件
node >= 8.0, npm >= 5
node -v
npm -v
升級(jí)weex-toolkit至最新
cnpm install -g weex-toolkit@latest
安裝 weex-ui
cnpm i weex-ui@latest -S
安裝babel-preset-stage-0(babel編譯)和 babel-plugin-component (優(yōu)化 weex-ui 包的組件引用)
cnpm i babel-plugin-component babel-preset-stage-0 -D
同時(shí)修改weex項(xiàng)目下的.babelrc如下
{
"presets": ["es2015", "stage-0"],
"plugins": [
[
"component",
{
"libraryName": "weex-ui",
"libDir": "packages",
"style": false
}
]
]
}
導(dǎo)入組件
<script>
import { WxcLightbox } from 'weex-ui';
export default {
components: {
WxcLightbox
},
....
使用組件
<template>
<div class="container">
<wxc-lightbox
height="100"
:show="show"
:image-list="imageList"
@wxcLightboxOverlayClicked="wxcLightboxOverlayClicked">
</wxc-lightbox>
...
如果最后你一直報(bào)錯(cuò)什么缺少bable-corl什么的可以參考
https://github.com/alibaba/weex-ui/issues/137
將文件/usr/local/lib/node_modules下的weex-toolkit反復(fù)刪除，反復(fù)執(zhí)行npm install -g weex-toolkit@latest就正常了
