# uni-app — Write Once, Run Everywhere with Vue for Mobile and Web

> A cross-platform framework using Vue.js syntax to build iOS, Android, Web, and mini-program apps from a single codebase.

## Install

Save in your project root:

# uni-app — Write Once, Run Everywhere with Vue for Mobile and Web

## Quick Use
```bash
npm install -g @vue/cli
vue create -p dcloudio/uni-preset-vue my-project
cd my-project
npm run dev:mp-weixin   # WeChat Mini Program
npm run dev:h5          # Web
```

## Introduction
uni-app is a cross-platform development framework that lets developers write apps using Vue.js syntax and compile them to iOS, Android, H5 web, and over 10 mini-program platforms including WeChat, Alipay, and Baidu. It eliminates the need to maintain separate codebases per platform.

## What uni-app Does
- Compiles Vue single-file components to native apps via a custom runtime
- Targets WeChat, Alipay, Baidu, Toutiao, QQ, and Kuaishou mini-programs
- Generates H5 web apps and native iOS/Android via a built-in rendering engine
- Provides a rich plugin marketplace with thousands of community extensions
- Offers conditional compilation directives for platform-specific code

## Architecture Overview
uni-app uses a compiler-plus-runtime architecture. At build time, Vue templates are transformed into platform-specific output (WXML for WeChat, AXML for Alipay, HTML for web). The runtime layer normalizes lifecycle hooks, event handling, and API calls across platforms. Native rendering on mobile uses a custom bridge similar to React Native.

## Self-Hosting & Configuration
- Install HBuilderX IDE for visual project management or use CLI
- Configure target platforms in `manifest.json` with app IDs and keys
- Set conditional compilation with `#ifdef` and `#ifndef` blocks
- Use `pages.json` for routing, tab bar, and navigation configuration
- Build production bundles per platform with `npm run build:<platform>`

## Key Features
- Single codebase targeting 13+ deployment platforms
- Conditional compilation for platform-divergent logic
- Native-level performance on mobile via optimized rendering
- HBuilderX IDE integration with debugging and hot reload
- Massive plugin ecosystem at ext.dcloud.net.cn

## Comparison with Similar Tools
- **Taro** — React-based alternative, stronger React ecosystem integration
- **Flutter** — Dart-based, better performance but no mini-program support
- **React Native** — Only targets iOS/Android, no mini-program output
- **mpvue** — Earlier Vue mini-program tool, now largely superseded by uni-app
- **Weex** — Alibaba project, less actively maintained

## FAQ
**Q: Does uni-app support Vue 3?**
A: Yes. uni-app has full Vue 3 and Composition API support in its latest releases with Vite as the build tool.

**Q: How is native mobile performance?**
A: uni-app uses a custom rendering engine (not WebView) for native apps, achieving near-native scroll and animation performance.

**Q: Can I use npm packages?**
A: Yes for H5 and native app targets. Mini-program targets have restrictions on packages that rely on DOM or Node.js APIs.

**Q: Is uni-app free for commercial use?**
A: The framework and CLI are fully open source under Apache 2.0. HBuilderX IDE is free but proprietary.

## Sources
- https://github.com/dcloudio/uni-app
- https://uniapp.dcloud.net.cn/

---
Source: https://tokrepo.com/en/workflows/asset-bc5d090d
Author: AI Open Source