explaingit

apache/incubator-weex-ui

★ 4,727VueAudience · developerComplexity · 2/5LicenseSetup · moderate

TLDR

A library of ready-made buttons, popups, lists, and other mobile UI components for Weex, the write-once run-on-Android-iOS-and-browser framework, so you don't build common interface pieces from scratch.

Mindmap

mindmap
  root((Weex UI))
    What it provides
      Buttons and popups
      List components
      Navigation elements
    Platform targets
      Android
      iOS
      Browser
    How to use
      npm install
      Import components
      Tree-shaking config
    Background
      Created by Alibaba
      Donated to Apache
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Add a pre-built sliding panel, popup, or button to a Weex mobile app without designing or coding it from scratch.

USE CASE 2

Build a cross-platform mobile app in Vue that runs on Android and iOS using only shared component code.

USE CASE 3

Enable tree-shaking in your build so only the Weex UI components your project actually uses are included in the bundle.

USE CASE 4

Consult the live demo site to browse all available components and see how they look before adding them to your project.

Tech stack

VueJavaScriptWeex

Getting it running

Difficulty · moderate Time to first run · 30min

Requires an existing Weex project setup and a build-tool configuration step to enable on-demand component loading.

Apache 2.0, use freely for any purpose including commercial projects, with attribution and license notice preserved.

In plain English

Weex UI is a library of ready-made interface components for building mobile apps with Weex. Weex is a framework that lets developers write code once and run it on both Android and iOS devices as well as in a browser. This library provides the building blocks, such as buttons, popups, lists, and other common interface pieces, so developers do not have to build them from scratch. The components are written in Vue, a popular way to describe user interfaces. Developers install the library through a standard package manager command, import the components they need, and drop them into their templates. A code example in the README shows how to add a button that opens a sliding panel: a few lines of HTML-like markup and a small amount of logic. The library is designed to load only the components a project actually uses rather than shipping everything at once. This requires a small configuration step to tell the build tool which parts to include. The project was originally created by Alibaba and later donated to the Apache Software Foundation's incubator program. Documentation and a live demo are available on the project's home page. Support channels listed in the README include a DingTalk chat group for questions.

Copy-paste prompts

Prompt 1
Show me how to install weex-ui via npm and add a WeexUI popup component to an existing Weex Vue project.
Prompt 2
Using apache/incubator-weex-ui, give me the markup and script needed to create a button that opens a sliding action panel when tapped.
Prompt 3
How do I configure my Weex build to use tree-shaking with weex-ui so only the components I import are bundled?
Prompt 4
What is the difference between Weex and React Native, and how does weex-ui fit into the Weex development workflow?
Prompt 5
List the categories of components available in weex-ui and show me a minimal example of using the list component to render items from an array.
Open on GitHub → Explain another repo

← apache on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.