42/666 HJDS| 微信小程序 之helloworld

hongjun

这是666计划的第42篇笔记

本微信小程序是极客时间“9小时搞定微信小程序开发”系列的笔记。

工具已经弄好， 第一步我们来建一个helloworld的小程序。

在新建的时候我们不选择模板， 这样会自动帮你建一个空的小程序项目。 建好后只有一个文件： project.config.json, 该文件保存的是开发者个性化设置。

整个helloworld的最终文件结构如下：

image

app.js

app.js 是注册一个小程序应用, 调用一个App函数。

App({
//空白
})

app.json

app.json是微信小程序的全局配置。

通过pages注册页面路径

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

helloworld模块

在pages下单独建一个helloworld的模块， 便于统一管理， 下面的文件都是同名的helloworld。需要有4个文件。

helloworld.js

注册小程序的页面， 通过Page函数。

Page({
  //空白
})

helloworld.json

helloworld页面的配置信息。

{}

helloworld.wxml:

页面的布局， xml的模式

<view>Helloworld</view>

helloworld.wxss:

描述小程序页面的样式

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

最终效果

image