简介 weexpack 是 weex 新一代的工程开发套件,是基于weex快速搭建应用原型的利器.它能够帮助开发者通过命令行创建weex工程,添加相应平台的weex app模版,并基于模版从本地.GitHub 或者 weex 应用市场安装插件,快速打包 weex 应用并安装到手机运行,对于具有分享精神的开发者而言还能够创建weex插件模版并发布插件到weex应用市场. weexpack 所提供的命令大致可分为三组,分别是: 打包命令 weexpack create - 创建 weex 工程项目.…

构建weex项目 安装weex-toolkit cnpm install -g weex-toolkit 初始化一个项目只需新建文件夹并在目录下执行 weex init 即可 安装依赖:cnpm install 编译项目:npm run dev 启动服务器:npm run serve //可以修改package.json的端口号来改变监听端口 可以执行的命令一览 使用weexpack打包weex项目 各种百度 'weex打包' '如何打包weex apk' 'weex 发布 apk' 未果 最后…

weexpack 的github地址:https://github.com/weexteam/weex-pack weex-toolkit: 初始化的项目是针对开发单个 Weex 页面而设计的,也就是说这样的项目只包括单个页面开发需要的东西,比如前端页面源文件.webpack 配置.npm 脚本等.项目产生的输出就是一个 JS Bundle 文件,可以自由的进行部署. weex-pack: 是初始化一个完整的 App 工程,包括 Android 和 iOS 的整个 App 起步,前端页面只是其中…

最下面是本人安装时候的系统环境,本篇文章只限于参考,不一定非得是这样,原因你懂得. 打包的过程中出现的问题 1.执行到weexpack run android的时候,到了resolving classpath的那里不动了? 解决办法:应该是build工具版本不对,可以打开android manager看看版本是不是build-tools 23.0.2,如果安装了比较新的build工具可以先把卸载掉,之后卸载掉平台,重新运行. 2.还是在weexpack run android的时候,到了buil…

一. weexpack build android  和  weexpack run android 的 区别. (1)单纯打包 weexpack build android (2)打包并运行 weexpack run android 注:执行时,发现两者都是调起了浏览器 二.不同平台的打包 html5平台: (1)打包html5平台 weexpack build web 这样你可以把打包后的资源上传到cdn服务器,然后上线你的web项目. (2)在 html5 平台运行 weexpack ru…

1: 首先确保 node.js版本大于6.0, 不然使用 weexpack 时会报错(部分使用es6语言,node版本太低不支持es6) 下面所有都是命令行执行的命令 2: 全局安装 weexpack npm install weexpack -g 3: 生成weex项目 weexpack create 项目名字 注意: 创建的工程默认不包含 ios 和 android 工程模版 4: 进入项目根目录安装依赖 npm install 此时如果你有其他的weex项目, 可以正常web上跑的, 你可…

一. weexpack build android  和  weexpack run android 的 区别. (1)单纯打包 weexpack build android (2)打包并运行 weexpack run android 注:执行时,发现两者都是调起了浏览器 二.不同平台的打包 html5平台: (1)打包html5平台 weexpack build web 这样你可以把打包后的资源上传到cdn服务器,然后上线你的web项目. (2)在 html5 平台运行 weexpack ru…

github地址:weex-ui https://github.com/alibaba/weex-ui 官网: https://alibaba.github.io/weex-ui/#/cn/ 创建项目: weexpack create appName cd appName npm install weexpack platform add android weexpack run android weexpack build android 安装 weex-ui npm i weex-ui -S…

1.weex 与 weexpack 即  weex-toolkit 与 weexpack 的区别 weex-toolkit 初始化的项目是针对开发单个 Weex 页面而设计的,也就是说这样的项目只包括单个页面开发需要的东西,比如前端页面源文件.webpack 配置.npm 脚本等.项目产生的输出就是一个 JS Bundle 文件,可以自由的进行部署. weex-pack 是初始化一个完整的 App 工程,包括 Android 和 iOS 的整个 App 起步,前端页面只是其中的一部分.这样的项目…

1.登录页 weexpack  Login.vue <!-- 登录页 --> <template> <div class="wrapper"> <div class="login"> <div class="input-wrapper"> <input v-model="userNumber" class="input" type="…

1. weexpack build android (1)Configuring > 0/3 projects > root project > Resolving dependencies ':classpat 使用weex build android 命令生成apk发现卡在这里不动 原因:检查源码发现,maven的地址是阿里巴巴的内网地址,所以一直卡在这个地方...能不能愉快的玩耍了!!! 解决方案:注释多余的代码. (2)Could not resolve all dependen…

8.4 Weex 双11会场大规模应用的秒开实战和稳定性保障 前言 Native 开发的诸多亮点中,流畅体验和系统调用是最多被提及的.流畅体验体现在页面滚动/动画的流畅性,背后是更好的内存管理和更接近原生的性能:同时又是 Web 的痛点:资源首次下载.长页面内存溢出和滚动性能.动画性能.传统 web 性能(如JS执行效率).Native 有丰富的系统调用能力,而 Web 痛点在于:W3C 标准太慢,有限的设备访问能力,API 兼容性问题较严重,如 Geolocation 在 Android We…

近期要做一个安卓端的原生应用程序.情况是这样的:需求方原先已经实现了网页,是一个工具类应用,大致作用是连接到他们公司生产的硬件,然后通手机与智能硬件通信来对硬件进行一系列控制.不过呢,这个网页先前是由工程师完成的,使用方式都是指令式的(比如连接服务器需要输入link server,发送信号需要send signal).嗯,这很程序员.这反人性的操作让使用人员用了不久就深恶痛绝,正好又有需求上的变更,于是他司决定重写页面,同时为了方便员工的使用需要以安卓app的形式完成. 然而我只是个JSer啊!…

weex概念与特性 最形象的理解就是类似react native. Weex几大特点: 1.帮助你构建原生应用 与 Web App.HTML5 App 或 hybrid App 不同,您可以使用 Weex 构建一个真正的原生应用.更贴心的是你的代码只需使用 HTML.CSS.JavaScript 可以构建原生应用,上手非常简单.但实际上,应用的底层是 Objective-C 或 Java, 同时,Weex 提供很多 native 组件或模块供开发人员使用. 2.一次编写,多端运行 Weex 提供…

在安装Weex Toolkit之前,需要确保安装了node, npm. yangfeifei:~ yff$ node -v v6.10.2 yangfeifei:~ yff$ npm -v 3.10.10 然后按照官网安装Weex CLI: npm install -g weex-toolkit 并确保版本号大于0.1.0: 安装完成之后,用weex命令验证是否成功 yangfeifei:~ yff$ weex Usage: weex <foo/bar/we_file_or_dir_path>…

使用weexpack构建weex应用时,npm run serve一直报这个错误 ERROR in index.web.js from UglifyJs Unexpected token: name (urlParts) [index.web.js:3754,4] ERROR in App.web.js from UglifyJs Unexpected token: name (urlParts) [App.web.js:3754,4] ERROR in page/web.web.js from…

weex-toolkit 的github地址:https://github.com/weexteam/weex-toolkit weex-toolkit: 初始化的项目是针对开发单个 Weex 页面而设计的,也就是说这样的项目只包括单个页面开发需要的东西,比如前端页面源文件.webpack 配置.npm 脚本等.项目产生的输出就是一个 JS Bundle 文件,可以自由的进行部署. weex-pack: 是初始化一个完整的 App 工程,包括 Android 和 iOS 的整个 App 起步,前…

[From] http://www.cocoachina.com/ios/20170601/19404.html 引子 这篇文章是笔者近期关于Weex在iOS端的一些研究和实践心得,和大家一起分享分享,也算是对学习成果的总结.文章里面提到的做法也许不是最佳实践,也许里面的方法称不算是一份标准的指南手册,所以标题就只好叫“伪最佳实践指北”了.有更好的方法欢迎大家一起留言讨论,一起学习. 由于笔者不太了解Android,所以以下的文章不会涉及到Android. 一. React Native 和 W…

用weex create创建一个APP项目,安装依赖后运行报 这个是package.json index.web.js 在dist目录下是build时生成的. 上面的答案没有给大家细节,不好意思致歉下面进行补充: 卸载 npm uninstall weex-toolkit -g // 卸载后一定用weex -v看下卸载了没!!! 到你node 安装的目录下的nodejs下node_modules看weex-toolkit 还在没!!!(windows)如果在删除之后再次重复上面的命令 删除 .x…

当我们运行打包脚本npm run build或者打包iosweexpack build ios有可能会遇到以下报错 ERROR in index.js from UglifyJs  这是因为webpack在打包vue文件时没有成功转换ES6的语法 解决方法 解决方法很简单,加入babel-preset-es2015…

安装 weexpack weexpack create my-project    //创建项目 cd my-project cnpm install //安装依赖 npm start //运行项目 weexpack platform add ios // 安装应用模板 生成 ios项目    执行完之后再platforms文件下生成 ios文件夹 weexpack platform add android //安装应用模板 生成android项目   执行之后在platform文件夹下生成an…

安装成功weex 创建项目 weex create my-project 提示 需要安装 weexpack    Installing 安装失败 后来卸载weex,重新安装weex 执行下面的命令: weex init 最后终于安装好了(之前不知道什么原因,一直安装失败,可能是网络不好吧) weex create my-project ok创建成功…

1.安装  路由模块  及  状态管理模块 npm install vue-router --save npm install vuex --save 2.自定义  TabBar  组件 src / components / TabBar.vue TabBar.vue <!-- 底部选项卡 --> <template> <div class="wrapper"> <div class="bar-item" @click=&q…

开发环境配置:http://www.cnblogs.com/crazycode2/p/7822961.html 1. weex create project  与  weex init project  的区别 > 个人理解weex-toolkit可以用来开发时调试,weexpack用作打包,但是怎么把weex-toolkit开发完成的文件放进weexpack进行打包呢 > 你只需要把你的vue 或者 .we文件放到src下面. > 使用weex-toolkit脚手架的init是初始化一…

一.创建 远程 icon 步骤一:打开  阿里巴巴矢量图标库 官网:http://www.iconfont.cn/ 步骤二:选择项目需要的 icon 步骤三:添加到项目(没有项目会自动创建) 步骤四:创建项目 步骤五:查看在线链接 步骤六:复制远程地址 步骤七:封装工具类 便于全局调用 util.js /** * 工具类 */ let utilFunc = { initIconFont () { let domModule = weex.requireModule('dom'); domModu…

1.创建 入口文件 src / entry.js /** * 入口文件 */ import App from './App.vue' import router from './router' // import { sync } from 'vuex-router-sync' import * as filters from './filters' import mixins from './mixins' // sync the router with the vuex store. //…

1.创建项目 weexpack create weexapp 2.安装必要插件 npm i jwt-simple vue-resource vue-router vuex vuex-router-sync weex-ui -S npm i babel-plugin-component babel-preset-stage-0 history quick-local-ip weex-builder weex-router -D 3.修改 scripts 指令 package.json "scrip…

1. Vue组件里面data()里面没有return时触发错误:Vue components Cannot read property '__ob__' of undefined 这个警告不解决会触发错误: 2. Vue项目开启局域网访问 有的项目比如移动端需要在手机上调试,这个时候需要用局域网开启在手机上查看. 解决方法:在配置文件加 --host 0.0.0.0 或者: 3.当我们运行打包脚本npm run build或者打包ios weexpack build ios有可能会遇到以下报错:…

转自: https://www.jianshu.com/p/139c5074ae5d 2018 JS状态报告: https://2018.stateofjs.com/mobile-and-desktop/react-native/ WEEX.React-Native开发App心得 起因 最近公司准备使用weex或者react-native进行跨平台开发,并不是要做新的app而是准备用这种方式代替原来webview+h5内嵌这种方式,这种hybrid的方式,存在于上古年代了,性能堪忧,还要适配安卓…

项目地址 git传送门(内附项目预览) Weex环境配置 npm install -g weex npm install -g weexpack # weex客户端的cli npm install -g weex-toolkit # 安装调试工具 ios依赖Cocopod环境 探坑总结 1.div无法渲染文本需使用<text>2.不支持富文本,需native单独封装module3.不支持z-index,层级靠后优先4.class表达式需使用数组形式,否则会报错5.css无法简写(例:paddi…