1、工具下载

官方链接:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

我选用的是稳定版 macOS

2、项目创建

一、扫码登录开发工具

二、点击小程序创建项目

我这里选择是小程序云开发,appid是登录微信公众号,点击开发的选项卡、开发设置

3、项目结构介绍

主要目录介绍:

  cloudfunctions:云开发中编写云函数的目录

  images:存放本地图片资源

  pages:存放编写页面相关代码(eg: js、json、wxss、wxml...)

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

一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下:

文件 必需 作用
app.js 小程序逻辑
app.json 小程序公共配置
app.wxss 小程序公共样式表

一个小程序页面由四个文件组成,分别是:

文件类型 必需 作用
js 页面逻辑
wxml 页面结构
json 页面配置
wxss 页面样式表

注意:为了方便开发者减少配置项,描述页面的四个文件必须具有相同的路径与文件名。

微信小程序入门笔记-小程序创建(2)的更多相关文章

  1. 微信小程序入门笔记

    目录的作用: 1. pages目录: 该目录下存放所有的定义页面 2. utils目录: 该目录下存放定义的一些小功能组件 3. 根目录下app.js文件: 定义小程序对象, 执行小程序生命周期内的各 ...

  2. 微信小程序学习笔记1--小程序的代码构成

    最近打算学习一下微信小程序,看了微信公众平台的文档感觉还比较简单,就从这个方向重新找回学习的状态吧: 1.先了解一下小程序的代码构成: 创建项目后会看到四种后缀的文件: .json 后缀的 JSON ...

  3. 微信小程序入门笔记-使用云开发(4)

    1.云数据库 一.介绍 云开发提供了一个 JSON 数据库,顾名思义,数据库中的每条记录都是一个 JSON 格式的对象.一个数据库可以有多个集合(相当于关系型数据中的表),集合可看做一个 JSON 数 ...

  4. 微信小程序入门笔记-开通云开发(3)

    1.介绍 开发者可以使用云开发开发微信小程序.小游戏,无需搭建服务器,即可使用云端能力. 云开发为开发者提供完整的原生云端支持和微信服务支持,弱化后端和运维概念,无需搭建服务器,使用平台提供的 API ...

  5. 微信小程序入门笔记-审核上线(5)

    1.点击上传 2.填写版本号.备注 3.https://mp.weixin.qq.com/回到微信公众平台,点击版本管理就可以看到开发版本 4.点击提交审核(提交之前填写小程序基本资料,才可提交审核) ...

  6. 微信小程序入门笔记-账号注册(1)

    小程序注册 微信小程序开发之前,必须先有小程序账号,下面是注册步骤: 1.打开网页 微信公众平台https://mp.weixin.qq.com/,点击立即注册按钮 2.注册类型 选择小程序开发 3. ...

  7. 【微信小程序学习笔记】入门与了解

    [微信小程序学习笔记(一)] IDE 下载安装 下载地址 官方工具:https://mp.weixin.qq.com/debug/w … tml?t=1476434678461 下载可执行文件后,可按 ...

  8. 微信小程序学习笔记(一)--创建微信小程序

    一.创建小程序 1.申请帐号.安装及创建小程序,请参照官方文档里面的操作 https://developers.weixin.qq.com/miniprogram/dev/. 小程序在创建的时候会要求 ...

  9. 天河微信小程序入门《四》:融会贯通,form表单提交数据库

    天河在阔别了十几天之后终于又回来了.其实这篇文章里的demo是接着(天河微信小程序入门<三>)后面就做了的,但是因为最近在做别的项目,所以就偷懒没有发出来.放到今天来看,从前台提交数据到数 ...

随机推荐

  1. Browser Security-基本概念

    URL格式: scheme://[login[:password]@](host_name|host_address)[:port][/hierarchical/path/to/resource[?s ...

  2. HGE引擎改进——2014/3/4

    2014/3/4 更新 1.提升资源包管理效率 2.Show库整合.目前Show库有Picture.Frame.Animation和Particle类,以及PictureData和ParticleSy ...

  3. Pycharm运行/调试程序说明

    1.字体调整(optional) File -> Settings ->Editor->Colors & Fonts -> Size 22 2.打开程序所在文件夹hw5 ...

  4. COCOAPI for windows error!

    refer this https://github.com/philferriere/cocoapi However, you may encounter a bug where you cannot ...

  5. Intellij IDEA使用(一)项目模板类型

    概述 IDEA默认打开后,会出现欢迎页面,可以选择打开Project的方式. 对于新建的Project,一般会选择[Create New Project],对于界面中,众多的Project类型,有时候 ...

  6. layui+springmvc实现文件异步上传

    一.单文件上传 前端代码 <div class="layui-upload"> <div class="layui-upload-list"& ...

  7. shiro中ecache-core版本引起的异常

    ecache-core包版本不对引起的错误,将2.5.3换成2.4.5就好了 来源 WARN [RMI TCP Connection(3)-127.0.0.1] - Exception encount ...

  8. Windows玩转Kubernetes系列3-Centos安装K8S

    以往文章参考: Windows玩转Kubernetes系列1-VirtualBox安装Centos Windows玩转Kubernetes系列2-Centos安装Docker 安装K8S yum in ...

  9. ROS和Gazebo进行机器人仿真(二)

    一.在Gazebo中使用ROS控制器 在本节中,我们将讨论如何在Gazebo中让机器人的每个关节运动. 为了让关节动起来,我们需要分配一个ROS控制器,尤其是,我们需要为每个关节连上一个与transm ...

  10. ros之自定义服务数据

    如何自定义服务数据 string name Uint8 age Uint8 sex Uint8 unknown =0 Uint8 male =1 Uint8 female = 2 (上面的是Reque ...