在這里簡略地介紹下,詳細看官方教程
Node.js官網 通常,安裝了 Node.js 環境,npm 包管理工具也隨之安裝了。因此,直接使用 npm 來安裝 weex-toolkit。
npm 是一個 javaScript 包管理工具,它可以讓開發者輕松共享和重用代碼。Weex 很多依賴來自社區,同樣,Weex 也將很多工具發布到社區方便開發者使用。
安裝完成后,檢測是否安裝成功
Microsoft Windows [版本 10.0.10586](c) 2015 Microsoft Corporation。保留所有權利。C:/Users/aaron>node -vv6.9.4C:/Users/aaron>npm -v3.10.10C:/Users/aaron>目前, weex-toolkit 目前僅有最新的 beta 版本開始才支持初始化 Vue 項目,使用前請確認版本是否正確。 安裝命令:
npm install -g weex-toolkit@beta安裝結束后,可以在打印信息里,看到安裝的位置
...C:/Users/aaron/AppData/Roaming/npm`-- weex-toolkit@1.0.1-beta.5 +-- chalk@1.1.3 | +-- ansi-styles@2.2.1 | +-- escape-string-regexp@1.0.5 | +-- has-ansi@2.0.0 | | `-- ansi-regex@2.1.1 | +-- strip-ansi@3.0.1 | `-- supports-color@2.0.0 ...使用weex命令驗證是否安裝成功
Microsoft Windows [版本 10.0.10586](c) 2015 Microsoft Corporation。保留所有權利。C:/Users/aaron>weexUsage: weex <foo/bar/we_file_or_dir_path> [options]Usage: weex init [PRojectName]Options: --port http listening port number ,default is 8081 [default: 8081] --wsport websocket listening port number ,default is 8082 [default: 8082] --output to build the js bundle to the specify a path [default: "no JSBundle output"]Usage:weex <command>where <command> is one of: debug start weex debugger compile compile we/vue file run run your projectweex <command> --help help on <command>C:/Users/aaron>查看Weex版本
C:/Users/aaron>weex -v v1.0.1-beta.5 - weex-devtool : v0.2.76 - weexpack : v0.3.5C:/Users/aaron>準備工作已經完成,接下來,hello Word!
初始化結束后,有兩個文件值得看(生成的項目功能和用法可以參考其 )。 描述項目一些配置 file: F:/0Develop/workspace_weex/weexVue/package.json created. 編譯運行步驟 file: F:/0Develop/workspace_weex/weexVue/README.md created.
之后我們進入項目所在路徑,weex-toolkit 已經為我們生成了標準項目結構。
在 package.json 中,已經配置好了幾個常用的 npm script,分別是:
build: 源碼打包,生成 JS Bundledev: webpack watch 模式,方便開發serve: 開啟靜態服務器debug: 調試模式我們先通過 npm install 安裝項目依賴。之后運行 npm run dev 和 npm run serve 開啟watch 模式和靜態服務器。
然后我們打開瀏覽器,進入 http://localhost:8080/index.html 即可看到 weex h5 頁面。

如果你需要集成到已有Android項目或其它,你就需要編譯vue生成js文件。 查看編譯命令語法
F:/0Develop/workspace_weex/weexVue>weexUsage: weex <foo/bar/we_file_or_dir_path> [options]Usage: weex init [projectName]Options: --port http listening port number ,default is 8081 [default: 8081] --wsport websocket listening port number ,default is 8082 [default: 8082] --output to build the js bundle to the specify a path [default: "no JSBundle output"]Usage:weex <command>where <command> is one of: debug start weex debugger compile compile we/vue file run run your projectweex <command> --help help on <command>F:/0Develop/workspace_weex/weexVue>weex compile Usage: weex-builder [options] <source> <dest> Options: -h, --help output usage information --ext [ext] set enabled extname for compiler default is vue|we --web set web mode for h5 renderF:/0Develop/workspace_weex/weexVue>weex-builder --ext vue F:/0Develop/workspace_weex/weexVue/src F:/0Develop/workspace_weex/weexVue/src/buildCommand { commands: [], options: [ Option { flags: '--ext [ext]', required: 0, optional: -7, bool: true, long: '--ext', description: 'set enabled extname for compiler default is vue|we' }, Option { flags: '--web', required: 0, optional: 0, bool: true, long: '--web', description: 'set web mode for h5 render' } ], _execs: {}, _allowUnknownOption: false, _args: [ { required: true, name: 'source', variadic: false }, { required: true, name: 'dest', variadic: false } ], _name: 'weex-builder', Command: [Function: Command], Option: [Function: Option], ext: 'vue', _events: { ext: [Function], web: [Function], '*': [Function: listener] }, _eventsCount: 3, rawArgs: [ 'E://0Develop//nodejs//node.exe', 'C://Users//aaron//AppData//Roaming//npm//node_modules//weex-builder//bin//weex-builder.js', '--ext', 'vue', 'F://0Develop//workspace_weex//weexVue//src', 'F://0Develop//workspace_weex//weexVue//src//build' ], args: [ 'F://0Develop//workspace_weex//weexVue//src', 'F://0Develop//workspace_weex//weexVue//src//build', [Circular] ] }build completed!output:F:/0Develop/workspace_weex/weexVue/src/build/foo.jsF:/0Develop/workspace_weex/weexVue>ok,已經編譯成js文件到你指定的位置了
你用Vue開發好頁面后,你就可以編譯成js文件,然后應用到Android項目了。 參考: 鏈接:http://pan.baidu.com/s/1eScbJzG 密碼:73q5

一個具有高并行研發能力、動態化和標準化規范化的移動應用應該由以下幾個方面構成:
|------|------|------|------| |-----|| page | page | page | page | | api ||------|------|------|------| | api ||------|------|------|------| | api || page | page | page | page | | api ||------|------|------|------| | api | | api ||---------------------------| | api || router | | api ||---------------------------| |-----|頁面:首先移動應用應該可以被拆解成若干個頁面,每個頁面相對解耦獨立,同時每個頁面都有一個 URL 進行唯一標識。路由:這些頁面將會通過路由機制有機的串聯起來,頁面之間的關系是通過路由來進行調度的。常見的移動應用路由包括導航欄、tab 切換等。設備能力:以各種 API 或服務的方式提供出來,供頁面自由使用。新聞熱點
疑難解答