微信小程序入门(二)

5.安装微信开发者工具

小程序入口文档

点“小程序开发”-->>"工具-->>再点左边的“下载”,进行开发者工具的下载

14cc1e9c561162a652dd214a283a4422.png

6.小程序代码结构简介

登陆开发者工具,创建小程序项目

426ce551ef848f3c758af25122ab64c3.png

目录结构

6c7c2f04c60f8921460df173ded508b0.png

7.小程序配置文件介绍

全局配置app

  • Pages
  • tabBar
  • networkTimeout
  • debug
  • navigationStyle

单个页面配置page

  • navigationBarBackgroundColor
  • navigationBarTextStyle
  • navigationBarTitleText
  • onReachBottonDistance
  • enablePullDownRefresh
  • disableScroll

8,9.开发者工具详解

创建一个'helloworld'的小程序,不使用模板

b1e44483f30ffef83f424c08a2ecaa16.png

开发者工具界面

5cd96ff0040cd2ffd3fa5f17e44404f9.png

小程序版本

  • 预览版本
  • 体验版本
  • 开发版本
  • 审核版本
  • 线上版本

10.创建第一个小程序

创建几个文件

app.js

作用:帮我们注册一个微信小程序的应用
先写成空

App({})

app.json

作用:是对我们微信小程序应用的一个全局配置
pages里面是目录

{
  "pages":[
    "pages/helloworld/helloworld"
  ]
}

helloworld.wxml

作用:wxml文件就是描述我们页面上要有哪些内容,类似HTML

<view>Hello World!</view>

hellorworld.js

作用:是帮助我们去注册一个微信小程序的页面
先写空

Page({})

helloworld.json

作用:页面的一些配置信息
先写空

{}

helloworld.wxss

作用:用来描述小程序的一个样式,类似css

view{
  width: 100%;
  height: 40rpx;
  text-align: center;
  color: blue;
}

目录结构和运行效果

889592004c5eaed97b050b96c822b738.png

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值