前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >微信小程序组件化开发框架wepy学习(一)

微信小程序组件化开发框架wepy学习(一)

作者头像
Javanx
发布2019-09-04 15:39:16
5020
发布2019-09-04 15:39:16
举报
文章被收录于专栏:web秀

准备工作

  1. 微信小程序原生开发文档熟悉
  2. 对前端mvvm有一定的了解
  3. 会nodejs npm 进行前端组件化开发

框架特点

框架的产生必然是解决开发中的痛点,wepy解决了什么问题? 主要是对原生的开发进行了简化。原生开发中每一个页面要对应四种文件, 而且交互、 数据绑定都十分繁琐 。wepy借鉴了vue的思想 , 实现了组件化,以组件代替模板和模块, 结构更清晰。同时数据的绑定,api都进行了优化。特别是参数的绑定和监视 都有很大的改观。极大提高了开发效率。

入门

环境要求:nodejs 环境。

命令行 node -v 查看有没有nodejs 环境. wepy的安装或更新都通过 NPM 进行。

wepy版本:最新的1.7.2版本

安装wepy 命令行在指定目下执行 npm install wepy-cli -g 进行全局配置wepy环境。

wepy init standard myproject 是原生的官方模板 初始化工程命令。通过 wepy list可以查看模板的列表, 目前模板比较少,主要有两个weui zanui。

步骤

在指定目录下执行初始化工程命令 wepy init + 模板名称 +自定义项目名称。 执行完毕后 cd 到自定义项目名称目录下 执行 npm install 进行相关的依赖安装。 安装完毕后 执行 wepy build -w 进行编译生成 dist 目录。 微信的开发工具 打开一定要打开 你 wepy init 的目录 不要打开 dist 目录 wepy build 命令Options: -f, --file 待编译wpy文件 -s, --source源码目录 -t, --target 生成代码目录 -o, --output 编译类型:web,weapp。默认为weapp -p, --platform 编译平台:browser, wechat,qq。默认为browser -w, --watch 监听文件改动 --no-cache 对于引用到的文件,即使无改动也会再次编译 -h, --help output usage information 目录结构

微信工具打开后编译正常, 出现正常显示的界面, 环境就配置完毕了,

开发中一般很少人使用微信的开发工具。会使用 Sublime、 Jetbrains、 IDEs 、Atom、 VS Code、VIM 等工具进行开发。 相关的高亮提示配置在官方文档也有。

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2018年9月17日,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 准备工作
  • 框架特点
  • 入门
  • 步骤
相关产品与服务
云开发 CloudBase
云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为200万+企业和开发者提供高可用、自动弹性扩缩的后端云服务,可用于云端一体化开发多种端应用(小程序、公众号、Web 应用等),避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档