Weex简介和环境的安装——Weex的学习之路(一)

2023-10-26

Weex 致力于使开发者能基于通用跨平台的 Web 开发语言和开发经验,来构建 Android、iOS 和 Web 应用。简单来说,在集成了 WeexSDK 之后,你可以使用 JavaScript 语言和前端开发经验来开发移动应用。也就是说学习了Weex就可以生成三端的程序。

Weex 渲染引擎与 DSL 语法层是分开的,Weex 并不强依赖任何特定的前端框架。目前 Vue.jsRax 这两个前端框架被广泛应用于 Weex 页面开发,同时 Weex 也对这两个前端框架提供了最完善的支持。Weex 的另一个主要目标是跟进流行的 Web 开发技术并将其和原生开发的技术结合,实现开发效率和运行性能的高度统一。在开发阶段,一个 Weex 页面就像开发普通网页一样;在运行时,Weex 页面又充分利用了各种操作系统的原生组件和能力。

Weex 应用需要依赖前端框架来编写,但 Weex 并没有绑定、限制在特定的框架上。目前 Vue.jsRax 是最广泛应用于 Weex 开发的前端框架,也是目前功能最全、最稳定的方案。

下面我们来看看Weex开发环境的安装:

一.安装依赖

Weex 官方提供了weex-toolkit 的脚手架工具来辅助开发和调试。

首先,你需要 Node.js 和 Weex CLi。安装 Node.js 方式多种多样,最简单的方式是在 Node.js 官网 下载可执行程序直接安装即可。通常,安装了 Node.js 环境,npm 包管理工具也随之安装了。因此,直接使用 npm 来安装 weex-toolkit, 你也可以通过 yarn 来进行安装。国内的开发者推荐将npm镜像切换至 Taobao NPM 镜像

运行下面的命令安装最新的beta版本工具:

 

npm install -g weex-toolkit@beta
weex -v // 查看当前weex工具版本

 安装结束后你可以直接使用 weex help 命令验证是否安装成功,它会显示 weex 支持的所有指令,同时,你也可以通过 weex doctor 命令检查你的本地开发环境。

二.初始化项目

初始化 Weex 项目的命令:

weex create awesome-project

 执行完命令后,在 awesome-project 目录中已经为我们生成了标准项目结构。

三.demo开发

进入项目所在路径,如果你在生成项目的时候选择了自动安装依赖,在进入项目后只需直接运行 npm start 就可以将项目完整跑起来,否则,你需要预先在项目中运行一下 npm install 安装项目所需依赖。

运行完后程序会自动在浏览器上打开一个如上的界面,这时我们就可以在手机上安装一个WeexPlayground然后用这个App扫描上图的二维码,那么这个就是Weex项目的Hello word了。

学习Weex也有一段时间了,一直没有写博客,后续我会将我的学习经历和踩坑写在博客里供大家参考!

参考文档:

Weex的中文官方地址:https://weex.apache.org/zh/guide/introduction.html;

Weex Ui地址:https://alibaba.github.io/weex-ui/#/cn/with-weex-toolkit;

Vue.js的官方地址:https://cn.vuejs.org/v2/guide/installation.html

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Weex简介和环境的安装——Weex的学习之路(一) 的相关文章

  • weex打包安卓艰苦之路

    weex打包安卓 一 配置安卓环境 下载安卓SDK配置ANDROID HOME配置 ANDROID HOME tools android h 检查是否配置成功 二 weex的安装使用 一 weex简介以及开发前提 1 简介 官网的解释为We
  • weex 项目上传服务器,Weex项目构建流程

    新建一个 package json 文件 xff0c 并且编写内容如下 xff1a 34 name 34 34 weex 34 34 version 34 34 1 0 0 34 34 description 34 34 34 34 mai
  • weex实践初探

    weex是阿里2016年开源的项目 号称通过撰写HTML CSS JavaScript来开发原生android ios的UI界面 并且接近原生的性能体验 写一次 多端编译 一直是无线移动追求的目标 既然阿里牛皮吹得这么大 本人也非常迫切体验
  • 第二天weex——flex布局

    flex布局 前言 之间陆陆续续的写过前端页面 对于布局方式几乎是不懂的 后来接触了flex布局就打算认真学习一番 对于flex布局是一种灵活布局 弹性盒子 flex 关于flex它有两条轴线 flex direction定义的是主轴线与之
  • Weex加载数据缓冲旋转动画的实现

    Weex Ui已经上线了加载动画了点击这里跳转 手写的我眼泪都掉了下来 由于Weex手机端不支持gif图片 然而公司项目又要我加个加载动画 所以手写了一个动画加载组件 注意1 需要用到组件不会用组件的可以点击看看这篇文章 Weex Vue组
  • 真香!27寸三星曲面屏写代码零Bug,包邮送一台!

    最近有粉丝留言让我多搞些抽奖活动 为了感谢大家对本公众号的大力支持本次联合了10个号主 送27寸三星曲面屏显示器 祝所有人新的一年工作顺利 工资芝麻开花节节高 希望本次抽奖可以给你带来好运 生活不易 望大家加倍努力 升职加薪 事业家庭双丰收
  • weex dom.scrollToElement 滚动问题

    使用weex 的dom scrollToElement 兼容问题 1 使用for生成的ref 在初始化获取ref节点时候需要有100ms延迟 2 dom scrollToElement 传入的 ref参数 需要使用this refs ref
  • 我玩某宝新模式2个月收λ15万,你觉得过气的行业,真的很赚钱!

    如果有人问 有什么事 比穷更难受 我的回答一定是 马上过年了 我还在喝西北风 我的朋友先暴富了 这段时间 我就被闺蜜美美狠狠扎了心 以前她和我一样是个普通上班族 去年做微商囤了大几万的货卖不出去 老公气得要和她离婚 整日垂头丧气 谁知年底了
  • OpenCV源码Android端编译,用时三天,我编了个寂寞。。。

    学更好的别人 做更好的自己 微卡智享 本文长度为1526字 预计阅读4分钟 导语 全网首发微信二维码引擎Android平台移植 中有介绍OpenCV源码及扩展模块Android端的编译 其中扩展模块里的人脸细节特征点是准备要测试看看的 于是
  • webstorm等JetBrains全家桶搜索任何插件都无反应

    使用webstorm搜索任何插件都无反应 打开webstorm设置 搜索settings或者是System Settings 找到HTTP Proxy 设置AUTO detect proxy settings后 点击右下角的Apply应用后
  • weex实现带有跟手动画的tab栏

    在weex开发的群中看到有人提到这个问题 就想着去实现以下 还不是很完美 只支持一屏的tab栏内容 后续会进行优化 2019 6 20 更新 已支持滚动跟手 可以超出屏幕 2019 6 23 更新 解决子元素包含滚动标签时无法滑动切换的问题
  • Weex 项目总结

    在项目中 我觉得暂时有两个地方需要总结一下 一个是weex内部的数据请求 一个是原生方法得调用 数据请求 在PC端调试的话会有跨域问题 在手机端没有跨域问题 原生方法需要原生开发者根据 Weex文档 写一个module 再暴露出一个方法给前
  • weex studio爬坑之旅之禁止ESLint

    weex studio爬坑之旅之禁止ESLint ESLint据说是个很好的插件 但是对我这种刚学weex的新手 在安装vue和weex ui后是免不了ctrl v的 但是运行后预览界面打不开着实让人头疼 weex studio也发行了许久
  • 无线路由器及Wi-Fi组网指南(史上最全)

    白驹过隙 逝者如斯 经过断断续续几个月的更新 关于无线路由器和Wi Fi的介绍终于告一段落 其实 这个话题下还有很多很多的内容没有涉及到 然生有涯而知无涯 只能在此暂且搁笔 后续缘起再续 下面 正文开始 1 什么是无线路由器 在5 时代 手
  • 陀螺研究院×BSN丨解析区块链视角下的消费者权益保护访谈全文发布

    3月是我国消费者权益保护月 在近日播出的3 15晚会中 央视曝光了科勒卫浴 宝马 Max Mara多家知名商店安装人脸识别摄像头 手机清理软件泄露老人隐私 瘦肉精羊等多个极其恶劣的消费者权益侵害行为 可以看出 随着数据时代的渐行渐近 消费者
  • 马斯克最新访谈全文,信息量极大,远见令人震撼

    建设太空文明和成为多星球物种是重要的 如果将来发生了第三次世界大战或者类似的事情 或者发生了全球性热核战争 那个时候可能地球上所有的文明都将被毁于一旦 但它至少能够继续在别的地方存在 作者 六毛 来源 车东西 特斯拉Model Y降价15万
  • 弃用Dubbo!这个新一代框架阿里都用疯了!

    哪个Java框架火 要说几年前 那你大可能会说是Spring Cloud Dubbo 但是现在 你还会说是它们吗 微服务当道 阿里巴巴开源一个Spring Cloud的子项目Spring Cloud Alibaba 它用两年的时间在众多架构
  • 阿里把中台变薄,背后逻辑是什么?

    颠覆式创新怎么做 中台适合做组合式创新 不适合做颠覆式创新 那么颠覆式创新如何做呢 各家巨头做法不太一样 腾讯使用 赛马机制 马化腾没有想到 10年前的那场 赛马 最后跑出来的是一个叫张小龙的人和他所带领的 微信 团队 而他们此前 从来没做
  • 在腾讯连拿六个五星

    刚毕业入职腾讯工作 2 3 年 半年 年终绩效每次都是 5 4 星 不一定年薪百万 主要薪资 奖金无法决定 这个取决于股票是否上涨不少 但晋升肯定是最快的 在阿里拿 375 跟在腾讯拿 5 4 星的比例差不多 应届毕业能拿一次确实很优秀了
  • Weex 介绍

    文章目录 一丶Weex的介绍 二丶前置知识 三丶适用人群 四丶Weex的优势 五丶难点 六丶Weex ReactNative Flutter的区别 七丶设计理念 八丶基本原理 九丶有谁在用 十丶Weex调试工具 十一丶构建一个最简单的应用

随机推荐

  • 实用Javascript 传值, 数据验证, 事件触发总结

    实用Javascript 传值 数据验证 事件触发总结 1 和JSP传值问题 1 普通提交form 的数据验证传值 html页面输入
  • :aftr和 :: after区别,顺便谈一谈CSS的伪类和伪元素

    在搞小程序的时时候会用到人家的组件button 人家弄了这个组件必然会设置一些默认值 比如边框 要想把这个边框弄没 就要用一下button after这个来处理一下 类似下面这样 button after border none 这时候 a
  • C语言里字符串的解析

    转自 https blog csdn net Code star one article details 78260482 函数名称 strtok 函数原型 char strtok char s1 const char s2 函数功能 分解
  • flink入门了解

    在线工程 在机器学习场景下 在线离线处理也会面临一些问题 首先会将离线的数据进行预处理和特征工程 如红框标注所示 然后进行离线的模型训练 训练好的模型会推到线上做推理 推理模块加载模型后 在线的数据也会有进行预处理和特征工程的过程 将处理之
  • lpr或商转公

    减少房贷的两种方法 1 央妈在2019推出lpr lpr你可以看作是根据市场变化的利率 如果你认为未来经济下行 利率下降 则你可以选择这个lpr作为房贷利率 否则则相反 lpr申请在2020 8月前都可以 后面就会根据lpr来还房贷 2 还
  • 介绍 Docker 的基本概念和优势,以及在应用程序开发中的实际应用

    Docker是一种基于容器的虚拟化技术 它可以将应用程序及其依赖包装成一个独立的容器 使其可以在不同的平台上进行移植和部署 Docker的基本概念包括镜像 容器 仓库和服务 镜像是Docker应用程序的基础 包括应用程序及其依赖的组件 容器
  • Unity创建脚本显示自己的名字以及时间

    using UnityEngine using System IO using System Text using System public class QHF Editor UnityEditor AssetModificationPr
  • 服务器 winsock修复,服务器/客户端:winsock 编程初体验

    服务器 客户端 winsock 编程初体验 前日看到听风大哥的帖子 写的是windows下的C S程序的简易示例代码 顿时有了感觉 以前在linux下写过 但是不知道如何去实际应用 便放在了一边 昨晚认真的拜读 改写了一下 今日记录下来 作
  • 类和对象总结一

    话不多说 我们直接进入主题 对象 客观世界里的一切事物都可以看作是一个对象 每一个对象应当具有属性 静态特征 比如一个班级 一个专业 一个教室 和行为 动态特征 例如 学习 开会 体育比赛等 两个要素 对象是由一组属性和一组行为构成的 类
  • 快来打造属于自己的天猫精灵

    看了天猫精灵的介绍 是不是觉得很神奇 实际每个程序要都可以打造属于自己的智能家居 可以实现的功能 点歌 最基础的功能了 可以将自己喜欢的歌曲下载下来 随时点歌 定时提醒 提醒自己吃饭 提醒自己睡觉 听故事 可以通过指令让其在线搜索小故事 然
  • 内存的分配与回收实验

    内存的分配与回收 北京师范大学珠海分校 实验目的 1 通过使用位图或空闲表 跟踪内存使用情况 模拟和评价不同的内存分配算法 2 熟悉内存分配和回收管理过程 实验要求 1 要求用你熟悉的程序设计语言编写和调试一个内存分配和回收模拟程序 要求在
  • 【智能制造】看完此文,听说外行都懂了ERP、APS和MES!

    导读 本篇文章通过漫画和故事的形式对APS MES与ERP的区别进行形象的PK 有趣又易于理解 一起来看下吧 先来说说ERP与MES的区别 ERP 企业资源计划
  • 用Python编写一个网站监测器

    网站监测器的背景和应用场景 网站监测器通常用于监测网站的可用性和性能 它可以帮助网站管理员及时发现网站故障 保证网站的正常运行 同时也可以提高网站的访问速度和用户体验 在本篇博客中 我们将介绍如何使用Python编写一个简单的网站监测器 以
  • chmod命令详解

    chmod用于改变文件或目录的访问权限 用户用它控制文件或目录的访问权限 该命令有两种用法 一种是包含字母和操作符表达式的文字设定法 另一种是包含数字的数字设定法 1 文字设定法 语法 chmod who mode 文件名 命令中各选项的含
  • 基于webview_flutter实现JsBridge的简单封装

    人气很高的flutter webview plugin 在打开多个WebView时会出错 而且缺少2个重要的功能 不能在JS中调用Flutter方法 不能在H5进入某个URL之前拦截 虽然该插件不够完整 但是使用起来很方便 封装了很多功能
  • CLion+Qt+win10配置,qDebug可用

    Clion Qt min10配置 Clion Qt win10配置 参考文章 https www bilibili com read cv6650223 https www freesion com article 90891407625
  • 【博学谷学习记录】超强总结,用心分享

    博学谷学习记录 超强总结 用心分享 Linux服务器集群 大数据基础环境搭建指南 一 第一台Linux服务器创建 二 Linux集群服务器环境搭建 1 通过ISO镜像文件搭建 不推荐 2 通过克隆搭建 强烈推荐 三 Linux集群服务器内存
  • Bi的ETL中怎么做增量处理

    增量抽取 增量抽取只抽取自上次抽取以来数据库中要抽取的表中新增或修改的数据 在ETL使用过程中 增量抽取较全量抽取应用更广 如何捕获变化的数据是增量抽取的关键 对捕获方法一般有两点要求 准确性 能够将业务系统中的变化数据按一定的频率准确地捕
  • ESP32 使用 Arduino 实现 OTA 更新

    在本指南中 您将学习如何使用库对 ESP32 开发板进行无线 OTA 更新 该库创建了一个网络服务器 允许您将新固件 新 sketch 上传到您的电路板 而无需在 ESP32 和您的计算机之间建立串行连接 此外 使用此库 您还可以将新文件上
  • Weex简介和环境的安装——Weex的学习之路(一)

    Weex 致力于使开发者能基于通用跨平台的 Web 开发语言和开发经验 来构建 Android iOS 和 Web 应用 简单来说 在集成了 WeexSDK 之后 你可以使用 JavaScript 语言和前端开发经验来开发移动应用 也就是说