开始

第一个微信小程序从申请账号开始。先到微信公众平台根据指引填写信息和提交相应的资料,就可以拥有自己的小程序帐号。

零基础搭建pytorch 零基础搭建小程序_零基础搭建pytorch


注册完成后,登录 小程序后台 ,我们可以在菜单 “设置”-“开发设置” 看到小程序的 AppID 了。

零基础搭建pytorch 零基础搭建小程序_开发者工具_02


小程序的 AppID 相当于小程序平台的一个身份证,后续你会在很多地方要用到 AppID (注意这里要区别于服务号或订阅号的 AppID)。

有了小程序帐号之后,我们需要一个工具来开发小程序。

安装开发工具

前往 开发者工具下载页面 ,根据自己的操作系统下载对应的安装包进行安装,有关开发者工具更详细的介绍可以查看 《开发者工具介绍》

打开小程序开发者工具,用微信扫码登录开发者工具,就可以开发你的第一个小程序了。

但是开发前还是建议务必先熟悉一下小程序原生的框架、组件和API。

小程序框架参考文档

项目搭建

由于之前一直是使用webstorm开发项目,我是很用不惯微信小程序开发工具的,而且也不习惯那种开发模式。所以在万能的网上找了一些资料,发现了一个宝藏

WePY

WePY 框架在开发过程中参考了 Vue 等现有框架的一些语法风格和功能特性,对原生小程序的开发模式进行了再次封装,更贴近于 MVVM 架构模式, 并支持ES6/7的一些新特性。

这套框架大大便利了小程序的开发,开发风格接近Vue.js,支持组件化,而且支持使用第三方 npm 资源。

而且重要的是,我可以用webstorm开发微信小程序了。

1.安装wepy框架

运行命令npm install wepy-cli -g可以全局安装wepy。

2.生成项目

使用 wepy init standard yourProjectName 初始化项目。

零基础搭建pytorch 零基础搭建小程序_零基础搭建pytorch_03


其中,


Use ESLint to lint your code? //是否使用ESLint帮你检测代码?


Use Redux in your project? //是否使用Redux来处理状态管理?


Use web transform feature in your project? //是否在项目中使用Web转换特性?

//进入到demo目录中
cd wqwxdemo
//安装依赖
npm install
3.运行项目

用webstorm打开项目,执行下列命令,开启实时编译。

wepy build --watch

执行命令后,会发现项目目录下生成了一个dist目录。

零基础搭建pytorch 零基础搭建小程序_微信小程序_04


打开微信开发者工具,选择小程序导入项目

零基础搭建pytorch 零基础搭建小程序_wepy_05


选择项目所在目录的dist文件夹,填写你的微信小程序AppID,点击导入。就可以打开项目了。

零基础搭建pytorch 零基础搭建小程序_开发者工具_06


但是Console中会有一个报错,如下:

零基础搭建pytorch 零基础搭建小程序_开发者工具_07

解决方法:

点击微信开发者工具右上角‘详情’,将项目设置改为如下配置即可:

零基础搭建pytorch 零基础搭建小程序_微信小程序_08


到此,一个项目就初始化完成了!接下开你就可以为所欲为了。

值得注意的问题是:
有时候你改了某块代码后发现小程序页面不管怎样都更新不了,这个时候你需要考虑到可能是缓存的问题,建议执行下面命令来清空缓存。

wepy build --no-cache --watch

最后

搭建好一个小程序项目后,你也许还不知从何处下手,那么建议你可以去github上看看。我推荐一个觉得不错的项目,代码地址:https://github.com/dyq086/wepy-mall.git

如果你想要一个漂亮的页面效果,可以结合一下UI组件库。

如:

weUI在线预览:

Vant Weapp在线预览:

谢谢观看