微信小程序Hello World

最新推荐文章于 2023-10-17 16:35:41 发布
原创 最新推荐文章于 2023-10-17 16:35:41 发布 · 582 阅读 · 2 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#微信小程序开发

本文介绍了微信小程序的开发流程，包括下载官方开发工具，新建项目并理解AppID的作用。接着，文章详细讲解了小程序的目录结构，如配置文件project.config.json、主体文件、页面文件等，以及各部分文件的功能。最后提到了其他自定义文件的使用，如全局js文件的引用方式。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

目录

下载开发工具

下载链接，并安装。

新建项目

Alt

  • 填写项目名称；
  • 目录：项目代码包存放的路径地址；
  • AppID：每个小程序账号都有一个AppID，小程序管理员可在微信公众平台查看。根据提示一步步注册即可（注册后可将AppIDcopy到文本里，以后常用）；
  • 开发模式：分为插件和小程序。插件是可被添加到小程序内直接使用的功能组件，与开发小程序相同，开发完成后可被其他小程序使用。此处选择“小程序”；
  • 后端服务：本案例选择“不使用云服务”；
  • 语言：本案例使用Javascript；
  • 点击“新建”后页面如下图所示：
    Alt

界面介绍

在这里插入图片描述

小程序目录结构

小程序目录结构主要包括配置文件、主体文件、页面文件等。具体介绍可查看

最低0.47元/天 解锁文章

200万优质内容无限畅学
微信小程序开发基础——第一个程序helloworld
总裁余（余登武）博客
11-23 510
微信小程序开发基础——第一个程序helloworld
微信小程序的Helloworld
yuanCruise
07-06 902
1.注册微信小程序 点击立即注册，选择微信小程序，按照要求填写信息 2.登录小程序并完善信息 填写小程序信息，完善信息。 3.下载小程序开发工具 完善信息后点击文档，工具，下载，选择稳定版的对应平台的安装包下载，下载完后点击安装即可 4.建立小程序项目 扫码登录，选择小程序，并点击加号，填写相关信息，APPID位置于下方截图所示。 5.小程序代码结构介绍 如下图所示...
极其简单的微信小程序HelloWorld示例
08-10
极其简单的微信小程序Hello World示例! A Simple WeChat Miniprogram Demo!
微信小程序之Hello World
qq_43565810的博客
08-01 319
1、下载及安装微信开发者工具，参考 2、注册账号，参考小程序接入指南 3、打开微信开发者工具 修改项目默认目录（可做可不做） 建立项目 填写相关信息，AppID在注册后才有，在开发设置中查看 复制后粘贴到AppID，不使用云服务，新建即可 最终在pages/index/index.wxml中输入Hello World即可 ...
微信小程序 之 Hello World!
晨曦
05-24 4606
微信小程序 之 Hello World!前言正文一、微信开发者注册二、开发工具下载三、工具安装三、创建项目四、项目结构讲解1. app.js2. app.json3. app.wxss4. project.config.json5. sitemap.json6. pages7. utils 前言   在做微信小程序之前，最好要有一些JavaScript和Html、css的基础，不过没有也没关系，学习中慢慢了解也可以，只不过你需要花费的时间就多一些。 正文   微信小程序的开发常规是使用微信开放平台提供的工具
第3节：微信小程序之hello world
ybb_ymm的专栏
03-22 1378
对一个刚刚接触微信小程序的开发者来说，这款微信开发者工具可能会比较陌生，但是大家尽可以放轻松，毕竟他只是一个工具，就像我们刚刚接触其他的开发工具一样。总有一个熟悉的过程。当你开发完成一款属于你的小程序，回过头来一看这就是一个为你工作的工具而已，从无到有。就是一个熟练使用的过程！
微信小程序学习笔记（2）----HelloWorld分析
赵侠客
09-28 5294
写在前面在学习HelloWorld之前首页需要破解微信开发工具，前面一篇有相关破解教程：http://blog.youkuaiyun.com/whzhaochao/article/details/52691550IDE结构上图是微信开发工具自动生成的一个HelloWorld，微信小程序的开发、调试都在这个工具中完成，相比于eclipse、Idea之类的Idea，小程序显示功能比较少，没多少菜单编辑编辑菜单中是存
简单的微信小程序helloworld轮播图菜单
08-10
本项目“简单的微信小程序helloworld轮播图菜单”是初学者入门微信小程序的一个基础示例，它包含了基本的页面结构、数据绑定、事件处理以及组件使用，特别是轮播图和菜单功能。 首先，我们要了解微信小程序的基本...
【helloworld】-微信小程序教程-入门篇【3】
03-29
目标用户：无编程经验，但对微信小程序感兴趣的同学。 学习目标：了解MINA框架的目录结构和配置。 案例分析：helloworld小程序。 备注：有编程经验或看过微信官网简易教程的同学，请酌情略过该章节。 2. 目录结构...
第一个微信小程序 hello world！
hy_696的博客
05-19 646
因为项目需要开始学习微信小程序了…… 1、建立一个微信小程序项目 如图，建立一个名为hello world的小程序项目（注意这里没有勾选建立快速启动模板，AppID需要自行注册） 2、建立根目录下文件 进入后软件截图如下 在根目录下建立app.json app.js app.wxss三个文件 （app.js——小程序逻辑文件，app.json——小程序配置文件，app.wxss——全局公共样式文件） （此时仍有报错，忽略） 3、建立页面文件 在根目录下建立pag...
┖no.1 ┒微信小程序之Hello World
zbwroom的博客
10-10 1081
微信小程序 Hello world
微信小程序开发初体验（第二篇【HelloWorld项目】）
qq_36344652的博客
10-17 1651
首次使用微信开发者工具编程，整理了一下自己的初步体验开发流程
微信小程序-HelloWorld
zuefeng的博客
09-12 506
1.全局配置 第一步： 配置app.js文件： app({}) 第二步：配置app.json文件： { “pages”:[“pages/Helloworld/HelloWorld”] } 2.页面配置 第一步：配置HelloWorld.js文件： page({}) 第二步：配置HelloWorld.json文件： {} 第三步：配置HelloWorld.wxml文件： 第四步：配置Hell...
微信小程序-hello world
lxrpatient的博客
06-13 1595
利用微信小程序开发者工具，编写一个小程序实现点击一个按钮显示helloworld。 工具下载与使用 首先在微信公众平台官网注册一个账号，然后在开发界面选择下载，如图1-1所示。 然后根据自身情况选择对应的版本，这里我选择的是开发版win64。下载安装之后得到开发工具。第一次运行微信扫描登录，然后选择新建项目得到如图1-2所示界面。项目名称应与目录一致，这里我的项目名称为helloworld。AP...
微信小程序开发入门（连载）—— Hello World
戴翔的技术博客
07-06 5492
上一篇：微信小程序开发入门（连载）—— 微信公众平台配置 3.1 微信开发者工具 前往 开发者工具下载页面 （https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html），根据自己的操作系统下载对应的安装包进行安装，有关开发者工具更详细的介绍可以查看 《开发者工具介绍》（https://developers.wei...
微信小程序开发系列之Hello World
李天泉
02-25 508
我们都知道，微信小程序已经火了很久了，但是，应该说，现在才是最火的时候吧，毕竟，很早之前，想要写个小程序Hello World，让别人看看，你需要企业身份注册（个体工商户也可以），限制多，让很多个人望而却步。时至今日（具体日期不再考究），可以个人注册了，那么就让我们来写一个自己的Hello World吧。第一步：注册在微信公众平台官网首页，点击注册。（相关文档可以找到，这里不再累述，望见谅。）微信...
微信小程序04-helloWorld
gaoya7305的博客
06-12 642
手把手教你创建一个helloworld 前言 创建好一个小程序工程文件，它会自动添加很多文件，我们把除了project.config.json 留下，其余全部删除。通过我们接下来一个个的文件创建，会让你加深对每个文件的理解。 部分文件介绍 project.config.json 保存用户的配置信息 一个微信小程序应用至少有连个文件： app.js, app.json app.js - 注...
微信小程序开发（一）之Hello World!
严富坤-昆明移动互联网
09-29 4557
一、工欲善其事，必先利其器——搭建开发环境     首先，到官方网站上下载一个开发工具，根据自己电脑的操作系统平台下载相应的版本。安装完成后运行开发工具，此时，需要用微信扫描上面的二维码才能继续后面的操作…… 开发工具下载地址 二、创建工程项目——Hello World     具体操作步骤如下图所示，很简单，在此就不在赘述了。 创建项目.png 三、开始写代码
``` 微信小程序helloworld居中布局```微信小程序helloworld居中布局
最新发布
11-09
微信小程序中的`helloworld`通常是用来展示首次运行程序的基本示例，它通常包含一个简单的欢迎页面。如果你想让这个页面内容居中布局，可以利用Flexbox或者Grid布局。这里我以 Flexbox为例，教你如何实现： 首先，...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Cocoa-k

好久没吃到肉了

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值