2016-12-07 19:22:11 weixin_36185028 阅读数 10918
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27747 人正在学习 去看看 秦子恒

从9月份微信小程序横空出世到现在的将近三个月,虽然尚未全面开放,却已红透大半边天,网友们贡献的各种资源教程也喷涌而出。

最近刚刚学完JavaScript的基本知识,忍不住也开始尝试一下微信小程序开发,对于官方提供的微信web开发者工具也是信心十足,但是实际操作中还是遇到了一些坑,对于像我一样的一个初学者,比如在该工具中创建项目后,存放各个页面的文件夹默认为pages,但是想把它改成其他名字,结果会出现不同的问题,下面分享自己是如何爬这个坑的,懂得的大神请忽略。

首先,现在下来最新的开发工具微信web开发者工具v0.11.112301,打开新建一个快速启动项目test,稍微改一下页面内容,只保留logs页面,效果和文件树如下所示:


由于某种原因,现在我需要更改pages文件夹名称,当然app.json里面对应的页面路径也要同步更改。

1,先更改文件树文件夹名称为pagestest,移开鼠标焦点点击空白处(此处若不移开鼠标焦点直接保存结果不会改变),保存(会出现报错一次),再更改app.json中的页面路径为"pagestest/logs/logs" 保存,显示效果正常为;

2,先更改app.json中的页面路径为"pagestest /logs/logs" 保存,页面显示pagestest/logs/logs.wxml,再更改文件树种的文件夹名称为pagestest保存,此时pagestest文件夹中又出现了另外一个文件夹pages,而且显示仍然是pagestest/logs/logs.wxml,而这个pages文件夹中也有一个logs文件夹,与原文件夹内容一样。

删除这个后来生成的pages文件夹,保存,此时的页面才显示出Hello World。有时删除pages后还不能正常显示,需要进入logs的wxml页面置入鼠标焦点,无需改变内容,保存一下即可。

另外,自己在尝试时也遇到过其他的情况:

1.生成的多余的页面文件夹也可能在于app.js同一层的位置;

2.更改后页面内容还是不能正常显示,这时进入wxml文件看一下内容,发现原本的文件内容变成了路径,所以删除文件后来生成的文件之前先看一下页面内容是否还存在。

 

综上所述,微信官方的开发者工具在用户体验上还是存在这个欠缺的,期待官方后面版本的更加人性化,

对于出现诸如以上问题,除了按方法1更改之外,当然一次性建好页面文件夹名称不再更改是最好的办法,如何无法确定后面是否需要更改,则可以用第三方编辑器比如sublime text进行代码变,可以在官方开发工具中查看效果,从而避免出现以上问题。

2018-10-23 17:21:48 zhichi_junjun 阅读数 107
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27747 人正在学习 去看看 秦子恒

微信Web开发者工具只有window版本和mac版本,如果想要在Linux系统下运行微信Web开发者工具,需要花费很大周折。

1、下载nwjs

下载nwjs的SDK。

2、将微信web开发者工具拷贝到nwjs

将在window系统下安装的微信web开发者工具文件夹中的package.nw、icon.ico、* 微信web开发者工具.exe拷贝到nwjs sdk解压后的文件夹内。

3、修改代码进入到nwjs文件夹,在终端内运行

$ ./nw

会出现提示 Cannot find module ‘…’

在这里插入图片描述

根据提示,在提示错误的文件内修改module名,因为名字大小写会有错误,比如appServiceConfig模块,它的实际模块名是appserviceConfig,这些都是大小写字母错误导致找不到模块。
会有几个文件需要修改,根据错误提示修改。
4、在微信小程序项目文件内创建run-detectors文件
在微信小程序项目文件夹内创建run-detectors文件,因为该文件没有扩展名,在linux系统会被认为是文件夹,导致找不到该文件导致报错。

在这里插入图片描述

5、下载wine

在命令行内运行
$ sudo apt-get install wine
在右键选择wine环境运行wcc.exe,会提示安装依赖。wcc.exe在linux的 /home/用户名/.config/微信web开发者工具/WeappVendor 文件夹内。
6、载入项目

在载入项目前,* 先在wine下运行wcc.exe和wcsc.exe(不提前运行wcc.exe和wcsc.exe的话可能会报错)。第一次载入项目后编译可能会慢一些,3、5s到10s左右,后面因为有缓存会快一些。

在这里插入图片描述

使用编辑功能可能会报错,所以不要用自带的编辑功能。7、编辑器
推荐使用webstorm,在File - Editor - code style - File Types内设置如图下所示。将wxss添加到css类型文件,将wxml添加到html类型文件。

在这里插入图片描述

微信的文件改变自动刷新会有3到5s的时间来编译,不是很快。

相关资讯: 微信小程序 微信小程序开发教程

2018-10-10 11:01:01 Creabine 阅读数 1070
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27747 人正在学习 去看看 秦子恒

使用mpvue写小程序,正常情况下npm run dev后修改文件并保存,会自动编译并在微信开发者工具中热重载。但有时候会失效,此时按如下步骤解决:

  1. 查看微信开发者工具中设置-编辑设置-编辑-保存时自动编译小程序 是否勾选。
  2. 清空dist文件夹。
  3. 在微信开发者工具-项目管理中删除该项目,选择空的dist文件夹重新添加。
  4. 重新执行npm run dev
  5. 修改文件试试,发现已解决。
2018-08-18 14:26:59 hellom_m 阅读数 1288
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27747 人正在学习 去看看 秦子恒

问题:

微信小程序文件目录原本放桌面,整理了下桌面,遂放到了D盘导致打开后没有内容。

解决:

  • 用微信开发者工具打开此项目,点击右上角有一个详情按钮。
    详情图片
  • 打开文件系统,找到WeappLocalData文件夹
    文件系统图片
  • 找到带有project字符,后面是此项目名字的json文件。
  • 打开此json文件,找到projectpath字段修改目录即可。
2019-10-21 18:41:16 zhouxinxin250 阅读数 28
  • 微信支付开发-微信公众号开发12-微信开发php

    微信公众平台开发之微信支付开发是子恒老师《微信公众平台开发》视频教程的第12部。详细讲解了用php进行微信支付的开发。内容包含获取支付密钥,微信公众号支付开发,扫码支付,微信刷卡支付,异步处理支付结果等等。欢迎反馈,微信/QQ:68183131

    27747 人正在学习 去看看 秦子恒

运行项目

  • 安装微信开发者工具

  • 下载源码,打开微信开发者,选择小程序导入源码,AppID改为自己申请的
    要设置为申请的AppID才有云开发选项。

  • 接下来申请云开发功能,进入云开发页面

    在存储里创建文件夹,将图片资源上传到文件夹中

    在数据库里创建集合,将数据导入到集合中

    要设置数据库用户读取权限才能拿到数据
    在这里插入图片描述

  • 修改云开发环境env
    在app.js文件中,直接修改env对应的云开发环境ID。

App({
  onLaunch: function () {
    if (!wx.cloud) {
      console.error('请使用 2.2.3 或以上的基础库以使用云能力')
    } else {
      wx.cloud.init({
        traceUser: true,
        env: 'mall-sit-3ld8k',
      })
    }
    this.globalData = {}
  },
})
  • 上传云函数,运行
    在每个云函数目录右键选择上传并部署。上传成功后目录图标变成云朵。

上传并部署有两个选项:

  1. 选择云端安装依赖(不上传node_modules)。
  2. 如果选择上传所有文件,可能会报错,没有安装wx-server-sdk。
    在这里插入图片描述
    要先安装wx-server-sdk要部署,进入你的函数文件夹,如login函数,进入文件夹之后执行
npm install --save wx-server-sdk@latest

等待安装完,看到你的文件多出一个目录node_modules。

没有更多推荐了,返回首页