本文的主要目的是介紹weex開發環境的搭建。環境基於windows.如果是mac或linux方法有一些不同,本文不在介紹。具體參考weex快速上手.
1.安裝node.js環境.weex專案的部署需要用到node.js的npm(node.js的包管理工具package manager)
檢視是否安裝成功
注意:在windows上安裝時務必選擇全部元件,包括勾選add to path.2.安裝weex-toolkit.方式一: 對於npm訪問正常的可以直接使用npm安裝。
方式二:對於國內訪問npm比較慢的使用者可以使用**的cnpm進行安裝。
方式一:
npm install -g weex-toolkit
方式二:
檢視安裝版本
此時我們已經完成了環境的搭建。
weex公升級後,生成js bundle的方法不一樣。隨著weex的版本更新,強烈建議公升級到最新版本。如果你的weex版本小於1.2可以參考第二部分的教程。
有兩種方法,建議使用方法一
方法一:覆蓋安裝。直接重新安裝weex,這樣會覆蓋安裝,得到的就是最新的版本。
weex覆蓋安裝
方法二:更新安裝
weex update weex-devtool@latest
//@後標註版本後,latest表示最新。
但是我用這種方法沒有安裝成功。使用方法一成功了。
最後,輸入 「weex -v」,檢視是否安裝成功。
weex公升級提示
當weex元件有新版本的時候,在我們建立專案時會有提醒。
出現此提示,說明weexpack需要公升級
按照提示的指令公升級到最新的weex,這裡我們執行
weex update [email protected]
1.建立工程使用weex create 命令
weex create learn-weex-fifth
新版本的的weex會預設執行 npm install,如果你執行預設操作,就可以繼續執行了,否則需要切換到工作目錄cd ***x
,安裝專案依賴npm install
.
2.打包jsbundle,並執行
執行npm start
會編譯生成jsbundle, 並執行server,並預設執行web preview. jsbundle生成目錄,當前dist目錄下。
執行npm start
說明:playgrond預設效果圖如上圖:server 的h5訪問通過:
jsbundle 目錄在當前dist目錄下。通過客戶端weex playground訪問 就可以看到weex效果了。(可通過掃碼的方式)
1.建立工程
weex create oneproject
2.安裝專案依賴
切換進工程目錄,執行npm install命令。
cd oneproject
npm install
3.打包jsbundle,並執行
weex src\index.vue
編譯打包jsbundle,命令執行後會自動執行weex server,可以看到執行效果了
說明:如上圖:server 的h5訪問通過:
jsbundle 目錄在上圖紅框標註的「.weex_tmp」目錄。其中,index.weex.js檔案就是生成的移動端js可解析檔案。
通過客戶端weex playground訪問 就可以看到weex效果了。(可通過掃碼的方式)
Weex專案環境搭建
官方指導 node.js需要4.0 4.改變原有的環境變數,1 我們要先配置npm的全域性模組的存放路徑以及cache的路徑,例如我希望將以上兩個資料夾放在nodejs的主目錄下,便在nodejs下建立 node global 及 node cache 兩個資料夾,輸入以下命令改變npm配置 1.n...
weex安裝環境 WEEX環境搭建與入門詳解
weex簡介 環境搭建 開發weex程式之前,需要先搭建好相關的開發環境,為了同時開發android和ios跨平台應用,你需要一台mac電腦,然後安裝一些必要的軟體。homebrew homebrew是mac系統的包管理器,用於安裝nodejs和一些其他必需的工具軟體。安裝命令如下 usr bin ...
weex開發環境配置
windows系統建議公升級到win10,win8也可以。win7下安裝由於許可權的原因,可能會失敗安裝webpacknpm install webpack gnpm install g weex toolkit安裝weex toolkit,這是官方提供的腳手架命令列工具,你可以使用它進行 weex...