微信小程序制作教程详解

随着微信小程序的日益普及，很多小程序开发者对制作小程序越来越感兴趣。，小编找到了一个制作微信小程序的教程。

首先，注册小程序帐户

1.进入微信公众平台注册小程序账号，根据提示填写相应信息。

2.注册成功后，进入首页，在小程序发布流程--；小程序开发和管理-；在配置服务器中，单击“开发人员设置”。

3.获取一个appid并记录下appid，这将在以后创建项目时使用。

注意：如果要在非管理员微信号的手机上体验小程序，还需要操作“绑定开发者”。即在“用户身份”——“开发者”模块中，你需要体验小程序的微信号。在本教程中，默认注册帐户和经验都是使用管理员微信号

第二，微信网络开发者工具

为了帮助开发者简单高效的开发，微信小程序引入了全新的开发者工具，集开发调试、代码编辑、程序发布等功能于一体。

1.根据系统选择相应的工具版本进行

2.该工具包括三个选项卡：编辑、调试和项目：

(1)编辑区可以对当前项目进行代码编写、文件添加、删除、重命名等基本操作

(2)程序调试有三大功能区：模拟器、调试工具和小程序操作区

(3)项目页签主要有三个功能：显示当前项目详细信息、提交预览、提交上传、项目配置

注意：启动工具时，开发者需要使用后台已经绑定成功的微信号扫描二维码进行登录，后续所有操作都以此微信账号为准

第三，写小程序的例子

1.实例小程序的目录结构

试验

佩奇

指数

指数

指数

索引

指数

app.json

2.文件描述和源代码示例

一个小程序包含一个app(主要部分)和多个页面(页面)

(1)app用来描述整个程序，由三个文件组成。带有的文件。js后缀是一个脚本文件。json后缀是一个配置文件。wxss后缀是一个样式表文件，必须放在项目的根目录下。

app.js是小程序的脚本代码(必选)，可以监控和处理小程序的生命周期函数，声明全局变量，调用框架提供的丰富的api。

app({

onlaunch:函数{

console.log('应用程序启动')

},

onshow:函数{

console.log('app show ')

},

onhide:函数{

console.log('app hide ')

},

globaldata: {

haslogin: false

}

})

app.json是整个小程序的全局配置(必选)，用于对微信小程序进行全局配置，确定页面文件路径，窗口展现，设置网络超时，设置多个标签等等。接受一个数组，每个数组都是一个字符串，以指定小程序由哪些页面组成。微信小程序中每一页的【路径页名】都需要写在app.json的pages中，pages中的第一页就是小程序的第一页。

{

第' :页[

'页面/索引/索引'

],

window':{

navigationbartextstyle ' : '黑色'，navigationbartitletext': '欢迎页面'，navigation barbakgroundcolor ' : ' # fbf 9fe '，backgroundcolor': '#fbf9fe '

},

debug': true

}

app.wxss是整个applet的通用样式表(不需要)。

第{

背景-color : # fbf 9fe；

高度：；

}。容器{

display: flex

flex-direction:柱；

比较小高度：；

justice-content :空格；

}

(2)page用来描述一个页面，一个页面由四个文件组成。这里以首页索引为例。每个小程序页面由四个不同的后缀文件组成，它们在同一路径下具有相同的名称，如index.js、index.wxml、index.wxss和index.json files with。js后缀是脚本文件。json后缀是配置文件。wxss后缀是样式表文件。wxml后缀是页面结构文件。

index.js是页面的脚本文件(必选)。在这个文件中，我们可以监听并处理页面的生命周期函数，获取applet的实例，声明并处理数据，响应页面的交互事件。

页面({

数据： {

标题： '小程序'，描述：“你好，！”

}

})

index.wxml是一个页面结构文件(必需)。

标题：{{title}}

描述：{{desc}}

index.wxss是一个页面样式表文件(不是必需的)。当有页面样式表时，页面样式表中的样式规则会覆盖app.wxss中的样式规则，如果没有指定页面的样式表，也可以直接在页面的结构文件中使用app.wxss中指定的样式规则。标题{

padding: 80rpx

线高： 1；

}。标题{

font-size : 52 rpx；

}。desc {

margin-top : 10 rpx；

color: # 888888

font-size : 28 rpx；

}

index.json是一个页面配置文件(不需要)。当有页面配置文件时，该页面上的配置项会覆盖app.json窗口中相同的配置项，如果没有指定的页面配置文件，将直接在该页面上使用app.json中的默认配置。这里不需要具体说明。

提示：

a.为了方便开发人员减少配置项，applet规定描述页面的四个文件必须具有相同的路径和文件名

b.小程序提供丰富的api，可以根据自己的需要进行选择

第四，测试小程序实例

1.打开微信web developer工具，选择“本地小程序项目”。

2.填写小程序的appid和项目名称，选择步骤3写的小程序实例文件夹，“添加项目”。

3.如果出现以下效果，恭喜你，你的第一个小程序项目已经写成功了！左侧边栏中的“编辑”，直接在右侧的编辑窗口中修改代码。保存(ctrl)和刷新(f5)以生效。

4.想在手机上看到小程序项的效果，左侧边栏的“项”，“预览”生成一个二维码，打开微信扫描，就可以看到了。

其实这个制作微信小程序的教程比较初级，容易操作，也容易成功。只要你细心，对比一下上面的流程和小程序代码就可以做小程序了~

下面是题目的开头。小程序因为违规被封杀的原因是什么？标题到此结束

小程序因为违规被封杀的原因是什么？有微信小程序管理员说自己的微信小程序被屏蔽了，但不知道自己的微信小程序为什么被屏蔽，违规小程序被屏蔽的原因是什么？我们来看看。

小程序因为违规被封杀的原因是什么？

违反小程序的原因之一：诱导分享，诱导关注

诱导分享：通过外链或微信账号消息的方式强迫或诱导用户与朋友圈分享消息的行为。奖励方式包括但不限于：实体、虚拟(积分、信息)等。

诱导关注：通过外链、微信账号群发或小程序二维码等方式，强迫或诱导用户关注微信账号的行为。奖励方式包括但不限于：实体、虚拟(积分、信息)等。

小程序违规的第二个原因被屏蔽了：抄袭

很多微信小程序因为抄袭了别人的微信小程序而被屏蔽。抄袭的内容如下：

1.复制内容：复制别人的内容，简单粗暴的复制粘贴。

2.整合内容：整理拼凑别人的内容。比如内容是红楼梦里所有比较美的诗。

3.引用内容：大篇幅引用别人的作品，比如“朱自清先生背影中说：(此处略)全文完毕。”

4.公开内容：公众共享的信息，如“法律法规、国家机关的决议、决定、命令等立法、行政、司法性文件、时事新闻、日历、总表、总表、公式”等。例如，达的重要讲话。

5.非独占授*内容：未经明确授*的内容不独占。比如处理别人的采访。

6.翻译内容：未经作者授*的翻译内容不能贴上“原创”的标签。

7.营销内容：内容主要指产品信息的推广和销售。比如“多功能按摩椅，(省略108功能介绍)，xx购买链接只要899！”

8.违法违规：涉及色情、暴力、虚假信息等。或违反相关政策法规。例如.(哼，你以为我会举例？)

违反小程序有三个原因：多次违反

屡次违规：违规行为得到处理后，以类似或其他形式继续违规；

违反小程序的原因有四：影响微信小程序平台的运行

从事欺诈活动：通过公布和传播虚构事实或隐瞒，实施欺诈、欺诈活动或为此类活动提供协助的行为；

反平台措施：单独或与他人共同进行技术对抗、规避规避、发现或制造平台漏洞实施违规或为微信小程序运营流程和规范策略提供协助；

阻碍平台运营：在注册和微信认证过程中，微信账号捏造事实、隐瞒、提交虚假信息等。这可能会影响、阻碍和破坏平台审核流程和判断。