Weex初探--从安装到运行首个app

简介: 好多人说Weex跨平台不错,一直要推荐我玩一下,我就不信了,来安装玩一下试试效果。实践出真知!安装过程各种坑,工具太多了,太麻烦了,差点放弃(还好坚持下来呢)。

好多人说Weex跨平台不错,一直要推荐我玩一下,我就不信了,来安装玩一下试试效果。实践出真知!安装过程各种坑,工具太多了,太麻烦了,差点放弃(还好坚持下来呢)。

一、安装Weex

(一)下载JDK 1.8(必须是1.8版本)
PATH:%JAVA_HOME%\bin
CLASSPATH:.;%JAVA_HOME%\lib\tools.jar (一定不要忘了前面的点) 
(二)Android Studio、SDK以及模拟器(如果是真机运行不需要安装模拟器)
  • Android Studio

    Android Studio的下载地址请看:https://developer.android.google.cn/studio/#downloads
    安装方式:指定安装路径,一直点击下一步就可以了。

  • SDK和安卓模拟器:

    打开Android Studio,File --> Settings --> 搜索sdk,找到对应的sdk进行安装即可,这里也可以选择安装模拟器,找到对应的勾选进行下载即可。
    需要在Path环境变量中添加两个值。分别是 Android SDK中tools目录的路径和platform-tools的路径。(如果已经配置,就不用再去配置了。)
    例如:

D:\android-sdk\tools;
D:\android-sdk\platform-tools;
(三)安装node

许多前端工具的安装都依赖于node的包管理器npm

  • 安装地址:

    Node官网: https://nodejs.org/
    如果官网打不开,可以看nodejs中文官网 https://nodejs.org/zh-cn/

  • 添加环境变量:

    下载好之后,复制node的安装路径,在path中添加node环境变量。

    示例如下:

E:\develop\nodejs\;
  • 查看node版本号:

    安装完成后在cmd中输入 npm -v 回车,如下图:

查看node版本号
  • 查看npm版本号:

    在cmd中输入 npm -v 回车,如下图:

查看npm版本号

※【说明】npm工具是nodejs里面自带的,所以只要配置了nodejs环境变量就OK了,不需要单独配置npm到环境变量。

(四)命令行输入npm install -g weex-toolkit@latest进行安装weex,如下图所示:
npm install -g weex-toolkit
(顺便说一下卸载命令行 npm uninstall -g weex-toolkit  这个是为了随时弃坑准备的)
(五)查看weex版本号,命令行输入weex -v

二、运行首个App

(一)初始化weex

首先创建一个文件夹,cmd进入文件夹根目录,使用命令行weex init开始初始化项目。

首次运行会检查环境,自动帮你安装weexpack,如下图:

(二)创建项目

使用weex create 项目名命令创建项目,创建过程有一大堆选项,可以自由选择,选择完毕就开始创建项目了。截图如下:

(三)添加安卓支持

执行weex platform add android命令。如图:

(四)运行项目

执行npm run android命令,运行在安卓设备上,如果要运行在模拟器,需要提前打开模拟器。使用示意图如下:

weex的demo演示

我的博客即将搬运同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=3ot4fb03pgw0o


【好消息】我的微信公众号正式开通了,关注一下吧!
关注一下我的公众号吧
相关文章
|
3月前
|
缓存 监控 Android开发
App Trace 快速安装解析(开发者视角)
App Trace 是一款应用性能监控工具,可追踪启动时间、方法耗时及卡顿等指标,助力开发调试与性能优化。支持 Android 和 iOS 平台,提供依赖引入、初始化配置和自动化脚本等快速安装方案,同时包含采样率、本地缓存等高级配置选项。集成后可通过日志检查与测试事件验证功能,注意在发布版本中使用 no-op 版本以减少性能影响,并确保隐私合规。
|
2月前
|
存储 人工智能 Android开发
为什么微信发送的APP安装不了,.apk转化为.apk.1
微信发送的APP文件常被改为.apk.1格式导致无法安装,推荐使用夸克或QQ浏览器解决。
207 14
|
3月前
|
监控 测试技术 Android开发
App Trace技术解析:传参安装、一键拉起与快速安装
本文从开发者视角解析App Trace技术的关键功能与实现方法,涵盖传参安装、一键拉起和快速安装技术。详细介绍了Android和iOS平台的具体实现代码与配置要点,探讨了参数丢失、跨平台一致性及iOS限制等技术挑战的解决方案,并提供了测试策略、监控指标和性能优化的最佳实践建议,帮助开发者提升用户获取效率与体验。
|
2月前
|
存储 Android开发 数据安全/隐私保护
Thanox安卓系统增加工具下载,管理、阻止、限制后台每个APP运行情况
Thanox是一款Android系统管理工具,专注于权限、后台启动及运行管理。支持应用冻结、系统优化、UI自定义和模块管理,基于Xposed框架开发,安全可靠且开源免费,兼容Android 6.0及以上版本。
163 4
|
3月前
|
存储 前端开发 JavaScript
仿真银行app下载安装, 银行卡虚拟余额制作app,用html+css+js实现逼真娱乐工具
这是一个简单的银行账户模拟器项目,用于学习前端开发基础。用户可进行存款、取款操作,所有数据存储于浏览器内存中
|
2月前
|
存储 移动开发 监控
App Trace功能实战:一键拉起、快速安装与免提写邀请码的应用实践
App Trace系统通过一键拉起、快速安装和免提写邀请码三大功能,显著提升用户转化率、安装成功率和邀请注册率。结合深度技术实现与优化,助力公司用户增长,成为移动端核心基础设施。
|
7月前
|
机器学习/深度学习 存储 人工智能
MNN-LLM App:在手机上离线运行大模型,阿里巴巴开源基于 MNN-LLM 框架开发的手机 AI 助手应用
MNN-LLM App 是阿里巴巴基于 MNN-LLM 框架开发的 Android 应用,支持多模态交互、多种主流模型选择、离线运行及性能优化。
5074 22
MNN-LLM App:在手机上离线运行大模型,阿里巴巴开源基于 MNN-LLM 框架开发的手机 AI 助手应用
|
11月前
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
1778 3
|
Android开发
Android 点击通知栏消息打开activity,并判断app是否运行
Android 点击通知栏消息打开activity,并判断app是否运行
2004 0
Android--判断APP是否运行
版权声明:本文为博主原创文章,转载请标明出处。 https://blog.csdn.net/chaoyu168/article/details/78988381 //通过判断手...
3582 0