Weex 是一套簡單易用的跨平臺開發方案，能以 web 的開發體驗構建高性能、可擴展的 native 應用，為了做到這些，Weex 與 Vue 合作，使用 Vue 作為上層框架，并遵循 W3C 標準實現了統一的 JSEngine 和 DOM API，這樣一來，你甚至可以使用其他框架驅動 Weex，打造三端一致的 native 應用。
Vue是什么
Vue.js 是 Evan You 開發的漸進式 JavaScript 框架，在易用性、靈活性和性能等方面都非常優秀。開發者能夠通過撰寫*.vue文件，基于,,快速構建組件化的 web 應用。
Hello World
嘗試 Weex 最簡單的方法是使用 Playground App 和在 dotWe 編寫一個 Hello World 例子。你不需要考慮安裝開發環境或編寫 native 代碼，只需要做下面兩件事：
為你的手機安裝 Playground App，當然，Weex 是跨平臺的框架，你依然可以使用瀏覽器進行預覽，只是這樣你就無法感受到 native 優秀的體驗了。
在新標簽頁中打開 Hello World 例子，點擊預覽，然后用 Playground 掃碼即可。
很簡單，我們可以看到語法就是我們熟悉的 Vue。你可以修改這個例子，再次掃碼嘗試。
搭建開發環境
第一步：安裝依賴
Weex 官方提供了 weex-toolkit 的腳手架工具來輔助開發和調試。首先，你需要 Node.js 和 weex-toolkit。
安裝 Node.js 方式多種多樣，最簡單的方式是在Node.js官網 下載可執行程序直接安裝即可。
對于 Mac，可以使用 Homebrew 進行安裝：
brew install node
安裝完成后，使用命令查看
node -v
v6.9.4
npm -v
3.10.10
通常，安裝了 Node.js 環境，npm 包管理工具也隨之安裝了。因此，直接使用 npm 來安裝 weex-toolkit。
npm 是一個 JavaScript 包管理工具，它可以讓開發者輕松共享和重用代碼。Weex 很多依賴來自社區，同樣，Weex 也將很多工具發布到社區方便開發者使用。
注意: weex-toolkit 目前僅有最新的 beta 版本開始才支持初始化 Vue 項目，使用前請確認版本是否正確。
npm install -g weex-toolkit@beta
國內開發者可以考慮使用淘寶的 npm 鏡像 —— [cnpm](https://npm.taobao.org/) 安裝 weex-toolkit
npm install -g cnpm
cnpm install -g weex-toolkit@beta
提示：
如果提示權限錯誤（permission error），使用sudo關鍵字進行安裝
sudo cnpm install -g weex-toolkit@beta
安裝結束后你可以直接使用weex命令驗證是否安裝成功，它會顯示weex命令行工具各參數：
Usage: weex foo/bar/we_file_or_dir_path? [options]
Usage: weex debug [options] [we_file|bundles_dir]
Usage: weex init
選項：
--qr? ? ? ? ? display QR code for PlaygroundApp? ? ? ? ? ? ? ? ? ? ? ? [布爾]
--smallqr? ? display small-scale version of QR code for PlaygroundApp,try it
if you use default font in CLI? ? ? ? ? ? ? ? ? ? ? ? ? ? [布爾]
-o, --output? transform weex we file to JS Bundle, output path must specified
(single JS bundle file or dir)
[for create sub cmd]it specified we file output path
[默認值: "no JSBundle output"]
--watch? ? ? using with -o , watch input path , auto run transform if change
happen
-s, --server? start a http file server, weex .we file will be transforme to JS
bundle on the server , specify local root path using the option
[字符串]
--port? ? ? ? http listening port number ,default is 8081? ? ? ? [默認值: -1]
--wsport? ? ? websocket listening port number ,default is 8082? ? [默認值: -1]
--np? ? ? ? ? do not open preview browser automatic? ? ? ? ? ? ? ? ? ? [布爾]
-f, --force? [for create sub cmd]force to replace exsisting file(s)? ? [布爾]
--help? ? ? ? 顯示幫助信息? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? [布爾]
-h, --host? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? [默認值: "127.0.0.1"]
weex debug -h for Weex debug help information.
for cmd example & more information please visit
https://www.npmjs.com/package/weex-toolkit
info [object Object]
初始化
然后初始化 Weex 項目：
weex init itxdl-project
執行完命令后，在itxdl-project目錄中就創建了一個使用Weex和Vue的模板項目
第三步：開發
之后我們進入項目所在路徑，weex-toolkit 已經為我們生成了標準項目結構。
在package.json中，已經配置好了幾個常用的 npm script，分別是：
build: 源碼打包，生成 JS Bundle
dev: webpack watch 模式，方便開發
serve : 開啟靜態服務器
debug : 調試模式
我們先通過npm install安裝項目依賴。之后運行npm run dev和npm run serve開啟watch 模式和靜態服務器。
然后我們打開瀏覽器，進入http://localhost:8080/index.html即可看到 weex h5 頁面。
初始化時已經為我們創建了基本的示例，我們可以在src/weex-bootstrap.we中查看。
代碼如下所示：
關于 Weex 語法部分，你可以直接參考Vue Guide，這里不再重復介紹。如果您想了解有關技術詳情的更多信息，請繼續閱讀下一節。并且不要忘記在 dotWe 寫代碼并隨時預覽。
