登录  /  注册

微信小程序开发系列(一)开发准备的详解

高洛峰
发布: 2017-03-09 13:31:26
原创
1197人浏览过

本文带来微信小程序开发系列(一)开发准备的详解

一:开发准备

一  注册微信开发者账号

登录:https://mp.weixin.qq.com/  进行注册.

目前仅支持企业和组织等非个人注册微信小程序账号,注册详细情况可以参见如下链接:

http://kf.qq.com/faq/140806zARbmm161103r6vmiA.html

注:如果仅仅是为了学习开发微信小程序,可以参考这个地址注册测试号:

二  微信开发者工具下载

由于微信公众平台改版,导致原来可以在https://mp.weixin.qq.com/wiki下面可以免费下载微信小程序开发工具这种可能没有了。

必须拥有微信小程序的开发账号,在如下网址下载扫描二维码下载开发工具。

https://mp.weixin.qq.com/debug/wxadoc/introduction/#登录

另外如果只是学习开发而已,可以在百度搜索微信小程序开发工具随意下载网友分享的工具也可以。

二:开发工具使用简介

1:PC桌面打开微信小程序开发工具(微信web开发者工具),如图1所示:

微信小程序开发系列(一)详解

图1

2: 用微信扫描图1中的二维码,如图2所示,并选择第一项“本地小程序项目”,如图3所示。(现在如果开发工具版本太低,扫描时会报错,请先升级开发工具,开发工具会自动检查版本并自动升级。)

微信小程序开发系列(一)详解

图2

微信小程序开发系列(一)详解

图3

3: 图3中如果第一次创建项目,请选择“添加项目”,否则选择已经添加的项目。选择“添加项目”,如图4所示。

微信小程序开发系列(一)详解

图4

4: 图4中如果仅仅是为了学习开发请选择“无AppID”,然后填写项目名称,选择项目目录,并且点解“添加项目”按钮。如图5所示,进入微信小程序开发工具主界面。

微信小程序开发系列(一)详解

图5

5: 图5中点击工具左上角的“编辑”,工具进入编辑模式界面,如图6所示

微信小程序开发系列(一)详解

图6

6: 图5中点击工具左上角的“调试”,工具进入调试模式界面,如图7所示

微信小程序开发系列(一)详解

图7

7: 图7中点击工具左下角的“后台”,此时程序模拟当电话打来时,微信小程序进入后台的状态,如图8所示

微信小程序开发系列(一)详解

图8
三:工程目录结构

1:打开微信小程序开发工具,进入编辑模式,如下图1所示

微信小程序开发系列(一)详解

图9

1:这个项目主要由pages/firstPage,pages/index,pages/logs,这几个文件夹组成,这几个文件夹主要描述整个小程序的界面信息。

每个文件下基本可以分为:.js,.wxml,.wxss,.json等文件组成。

例如:

index.js:描述index页面的逻辑信息(类比:js代码)

index.wxml:描述index页面的布局信息(类比:HTML页面布局)

index.wxss:描述index页面的布局的样式信息(类比:CSS信息)

2:项目总体配置信息:

由app.js,app.json,app.wxss三个文件组成

app.json:由图1所示,描述整个工程的页面信息(由"pages"描述),"window"主要描述该项目整体背景,导航栏等样式,如果某个文件夹中某个.json文件中有相同的描述,则会覆盖"window"中描述的信息。

app.wxss:主要描述该项目整体的样式,如图2所示

微信小程序开发系列(一)详解

图10

app.js:主要描述该项目入口逻辑,主要描述一些用户登录后的信息,如图3所示

微信小程序开发系列(一)详解

图11

以上就是微信小程序开发系列(一)开发准备的详解的详细内容,更多请关注php中文网其它相关文章!

智能AI问答
PHP中文网智能助手能迅速回答你的编程问题,提供实时的代码和解决方案,帮助你解决各种难题。不仅如此,它还能提供编程资源和学习指导,帮助你快速提升编程技能。无论你是初学者还是专业人士,AI智能助手都能成为你的可靠助手,助力你在编程领域取得更大的成就。
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2024 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号