文档章节

微信小程序(一):微信小程序申请注册与开发流程

阿东_Luck
 阿东_Luck
发布于 2016/11/21 16:01
字数 1076
阅读 101
收藏 1

本文主要用于介绍微信小程序开发过程中的注意点,查阅过程请结合微信的开发者文档一同观看。 本文基于微信小程序公测版,IDE:微信开发者工具 0.10.102800 本文档用于帮助公司内部初学者,如有感觉拖沓请见谅

附:微信小程序开发文档

AppID申请

AppID 作为开发者的身份标识,在公测阶段暂不支持个人申请,仅支持 企业,政府,媒体,其他组织 四种身份,并需提供相应的证明资料。没有 AppID 并不影响开发,只是不能在微信上调试,故而只能在IDE中调试。

每一个 AppID 有管理员和开发者的身份。管理员只有一个,并且不能更改;开发者对于未认证的小程序最多为10个,认证的小程序最多为20个。只能具备其一,才能在其微信上预览。

环境搭建

附:IDE下载地址。下载后直接无脑安装到本地即可。


1.登录

与别的IDE不同,需使用微信号登录。这也是前文提到的需要 管理员和开发者的身份 的凭证。

Alt text

选择本地小程序项目

Alt text

添加项目

Alt text

填写appID,如果没有的话,单击无appID,会提示你部分功能受限,不用在意。填写项目名称和选择项目目录即可。勾选了 在当前目录中创建 quick start 项目 会在你选择的目录下生成一个快速开发的demo程序。点击添加项目完成创建。

Alt text


2.IDE介绍

作为公测的产品,此次版本的IDE还是比较简陋的。相信当微信小程序正式推出的时候,在IDE的使用上会有很大提升,来满足开发者的开发要求。

第一次打开IDE的界面如下:

Alt text

可以看见在页面左边的导航区域,有 编辑,调试,项目,编辑,关闭 五个选项。我们可以在**“编辑”里可以查看和编辑我们的代码,在“调试”里可以测试代码并模拟小程序在微信客户端效果,在“项目”**里可以发送到手机里预览实际效果。至于编译和关闭,只是两个功能按钮。(顺带说一句,这个IDE在 Ctrl + S 的时候会自动编译)

编辑时,功能区如下:

enter image description here

开发流程

1.目录结构

第一次创建项目,工程目录如下:(会生成两个页面并可以运行)

Alt text

可以看见程序中的文件有四种类型。

.js : 逻辑控制,用于写javascript代码。 .wxml : 页面结构,用于写html。当然,微信对其有一定的封装,用的话还需要了解其标签。 .wxss : 样式表文件,用于写css。 .json : 样式配置,符合json语法格式。用来做其作用域内的设置。

做前台的小伙伴看到这心情一定很激动,这不就是前端代码嘛。


小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。

1.1 以app命名的各个文件是整个app的全局配置文件,其必须放在项目的根目录下。如下:

enter image description here

官方介绍很详细,就不赘述了: app.js , app.json , app.wxss.

1.2 pages 目录下,为工程中的页面,每一个页面对应pages下的一个文件夹。文件夹名和文件名一致,不同文件以后缀区分(注意并不是每个文件都是必须的)。

enter image description here

官方介绍很详细,就不赘述了: .js , .wxml , .wxss, .json.

注意:描述页面的这四个文件必须具有相同的路径与文件名。


2.组件

微信基于HTML封装了一系列的控件,旨在减少大家的开发难度与工作量,请查看 官方文档

注意:所有组件与属性都是小写,以连字符 - 连接


3.API

请查看 官方文档

© 著作权归作者所有

阿东_Luck
粉丝 0
博文 7
码字总数 6748
作品 0
长春
程序员
私信 提问
加载中

评论(1)

9
92年的java
http://www.jujingyun.com 北京网站建设
http://www.shjuntang.com 上海装潢
2018最新-9小时搞定微信小程序开发

2018最新-9小时搞定微信小程序开发 网盘地址:https://pan.baidu.com/s/1N6IGuXgF3YrVvmCNi1T--Q 密码:f8pq 备用地址(腾讯微云):https://share.weiyun.com/5rrdDMP 密码:ap7b9q 本课程为...

人气王子333
2018/05/10
0
0
走路带疯/wx_yq_mall

微信小程序商城【wxyqmall】 微信小程序商城,微信小程序微店,长期维护版本,欢迎大家踊跃提交贡献代码; 参与开发 更多项目请关注 https://gitee.com/TengWeiYun。 小程序开发 [微信:hq5...

走路带疯
2018/08/31
0
0
微信小程序开放公测,企业、政府及媒体可申请

11 月 3 日晚间,微信团队对外宣布,微信小程序开放公测,开发者可登陆微信公众平台申请,开发完成后可以提交审核,公测期间暂不能发布。 根据微信团队的介绍,开放注册范围为企业、政府、媒...

局长
2016/11/03
3.6K
15
巧用微信小程序

巧用微信小程序,便利店营业额每天增长30% 在上海市浦东外高桥有一家夫妻便利店,与其他便利店一样,主要销售零食饮料和一些普通生活用品。老板眼光独到,提前准备,搭上微信小程序的风口,成...

湃点科技
2017/12/28
4
0
微信小程序唤起其他微信小程序 / 移动应用App唤起小程序

1. 微信小程序唤起微信小程序 小程序唤起其他小程序很简单 先上链接 小程序跳转小程序 Navigator组件 推荐使用 小程序跳转小程序 wx.navigateToMiniProgram(OBJECT) API 即将废弃 不推荐使用...

一个程序猿的每一天
2018/05/30
0
0

没有更多内容

加载失败,请刷新页面

加载更多

MySQL8.0.17 - Multi-Valued Indexes 简述

本文主要简单介绍下8.0.17新引入的功能multi-valued index, 顾名思义,索引上对于同一个Primary key, 可以建立多个二级索引项,实际上已经对array类型的基础功能做了支持 (感觉官方未来一定...

阿里云官方博客
29分钟前
3
0
make4.1降级 make-3.81、2错误

在编译 make-3.82 的时候出现如下错误提示 glob/glob.c:xxx: undefined reference to `__alloca'` 修改 /glob/glob.c // #if !defined __alloca && !defined __GNU_LIBRARY__ # ifdef __GNUC......

Domineering
30分钟前
2
0
Rainbond集群的安装和运维的原理

本文将解读Rainbond集群的安装和运维的原理,使用户基本了解Rainbond的安装机制和运维重点,便于用户搭建大型Rainbond集群。 1.Rainbond集群节点概述 1.1 节点分类 属性 类型 说明 manage 管...

好雨云帮
41分钟前
5
0
好程序员大数据学习路线分享UDF函数

1.为什么需要UDF? 1)、因为内部函数没法满足需求。 2)、hive它本身就是一个灵活框架,允许用自定义模块功能,如可以自定义UDF、serde、输入输出等。 2.UDF是什么? UDF:user difine fun...

好程序员官方
44分钟前
4
0
Groovy中 Base64 URL和文件名安全编码

Base64 URL和文件名安全编码 Groovy支持Base64编码很长一段时间。 从Groovy 2.5.0开始,我们还可以使用Base64 URL和Filename Safe编码来使用encodeBase64Url方法对字节数组进行编码。 结果是...

白石
47分钟前
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部