美文网首页
搭建weex项目

搭建weex项目

作者: 和弦之乐 | 来源:发表于2019-05-19 14:48 被阅读0次
  1. 检查并安装nodejs
  2. 安装全局weex-toolkit
    npm install weex-toolkit -g
  3. 创建一个空的Weex + Vue.js模版项目
    weex create projectName
  4. 进入刚刚创建的文件夹,并且安装依赖,然后执行 npm start
cd projectName
npm install
npm start

此时,工具会启动一个本地的 web 服务,监听 8081 端口。可以打开 http://localhost:8081 查看页面在 Web 下的渲染效果。 源代码在 src/ 目录中,可以像一个普通的 Vue.js 项目一样来开发.

还可以打开 http://localhost:8081/preview.html 开启一个预览页面,它会把 web 端的页面放在一个 iframe 中渲染,而且在右侧生成一个二维码。用 Weex playground app 扫描这个二维码可以看到页面在手机上渲染的真实效果。

  1. 默认情况下 weex create 命令并不初始化 iOS 和 Android 项目,你可以通过执行 weex platform add 来添加特定平台的项目。
weex platform add ios
weex platform add android
  1. 配置客户端的开发环境,在本地机器上打开 Android 和 iOS 项目( iOS:安装并且配置好 Xcode; Android:安装并且配置好 Android Studio

  2. 运行下面的命令,可以在模拟器或真实设备上启动应用

weex run ios
weex run android
weex run web
  1. 启动调试服务 ,在 Chrome (目前只支持基于 V8 引擎的桌面浏览器) 中打开调试页面
    weex debug

相关文章

  • Weex 1:Weex接入iOS项目

    导语: 本文介绍Weex的环境搭建,以及如何将Weex接入iOS项目中 一、环境搭建#### 1、安装homebr...

  • 搭建weex项目

    检查并安装nodejs 安装全局weex-toolkitnpm install weex-toolkit -g 创...

  • 🐱[Weex] 一、Weex项目的搭建

    【前言】 本节主要介绍如何快速的创建一个名为"helloweex"的Weex工程。 1. 首先选择要创建工程到哪个...

  • 关于weex环境搭建坑,对应方案

    记录如何用weex-toolkit搭建weexDemo环境 weex create myWeex weex pla...

  • weex开发之使用webpack优化打包

    之前我们已经说过使用gulp+weex来搭建一个weex的开发环境,weex+express+gulp开发文件搭建...

  • weex命令

    1,创建weex项目脚手架 weex create— 创建 weex 工程项目 2,增加/删除平台 weex pl...

  • Weex开发之-Hello Weex

    上一篇写了Weex的开发环境搭建Weex开发之-开发环境搭建[https://www.jianshu.com/p/...

  • Weex 架构分析

    最近工作一直在搭建weex的项目架构,对于Weex开发需要理解很多概念并且需要强大的内心,因为还没有比较成熟,所以...

  • (26)打鸡儿教你Vue.js

    weex框架的使用 1、weex开发入门2、weex开发环境搭建3、掌握部分weex组件模块4、了解一些vue基本...

  • WEEX快速创建工程 Hello World

    1.按照weex官网搭建环境,安装依赖(安装node 和 npm,weex-toolkit,安装完后可以weex ...

网友评论

      本文标题:搭建weex项目

      本文链接:https://www.haomeiwen.com/subject/xlzfzqtx.html