当前位置：首页 > 新闻动态 > 网站文章

vscode中怎么进行微信小程序的发布（方法详解）

来源： 浏览：115 时间：2023-08-07
使用 symbolic-ref获取当前分支

        其实 Git命令分为两种

  • 高层命令（porcelaincommand
  • 底层命令（plumbcommand

        常用的命令大家都很熟悉了什么 branch啊，init啊，add啊，commit啊等等。底层命令又是什么鬼，其实所有的高层命令的实质都是会调用底层命令，可以类比为语言层面 JavaC#Js这些高级语言他底层是使用 C或者 C++一个概念。有兴趣请移步

        symbolic-ref命令能干嘛呢？

.git/HEA D
Git.Core.exec["symbolic-ref","--short","HEA D"],option;

        git.t中增加基本命令方法

//git.t局部代码exportfunctionsymbolicRefoptions:GitExecOpt={}{returnCore.exec["symbolic-ref","--short","HEA D"],option;}

        gitServic中实现 getCurrentBranch方法

//gitService.t局部代码publicasyncgetCurrentBranchfilePath:string:Promise{constbranchNam=awaitGit.Cmd.symbolicRef{cwd:filePath};returnbranchName.replac/ /g,"";}保管修改和切换分支

        当我获取到当前分支之后，和我目标分支进行比对如果一致的话直接跳过该步骤，否则就需要对当前分支保管并且切换了

        为了方便对于保管和切换我直接用了Gitstash和 checkout命令，并且封装了两个方法。

//git.t局部代码 exportfunctioncheckoutoptions:GitExecOpt={}{constparam=["checkout"];ifoptions.branchNam{params.pushoptions.branchNam;}elsifoptions.fileNam{params.push'--',options.fileNam;}returnCore.execparams,option;}exportfunctionstashoptions:GitExecOpt={}{constparam=["stash"];ifoptions.stashPop{params.push'pop';}returnCore.execparams,option;}外地构建

        继续分析下本地构建的基本流程

        大致分以下几步

  • 自动生成版本号
    • 得到当前 AppID微信模板库中版本号情况
  • 注入需要发布的小程序 AppID
    • 需要修改 src/manifest.json文件中 AppID方便开发工具上传使用
  • 运行 uni-app构建命令
    • rununiapp命令
  • 撤销发布时候的临时文件修改
    • 撤销文件修改

        能力上来说有那么几个

  •         微信 api调用

  •         文件读取和修改能力

  •         Shel命令执行能力

  •         撤销文件修改能力

    •         首先怎么调用微信的api由于那时候我亲爱的后端同学啃次啃次的已经吧微信 token鉴权的能力已经做掉了所以我直接接后端的微信鉴权能力就可以了但是怎么接又是个问题，虽然人家已经有个 rest接口可以用，但是接口都要登录的啊，让人家为了这个小小的需求弄个匿名的不大现实也不安全，想来想去那就不要用 rest直接调他后面提供的Dobbo服务好了完美。

    获取微信 accessToken

            获取微信 api调用前我需要先得到accessToken

            所以我会先用一个公共方法先去获取当前 accessToken然后在去请求微信开发平台 api

    //miniProgramService.t局部代码 publicasyncretrieveWxToken:Promise{if!Launcher.dobboService.dubbo.mp{thrownewError"dubbo初始化错误";}const{success:dobboSuccess,error,result:wxToken,}=awaitLauncher.dobboService.dubbo.mp.getComponentToken;if!dobboSuccess{thrownewError`dubbo调用失败:${error}`;}console.log"wxToken:",wxToken;returnwxToken;}

            如果你后端没有支持微信开发平台的鉴权能力的话就需要自己用 nodej方式去实现了具体的微信开放平台文案请移步

    微信开放平台 api调用

            其实微信开放平台 api调用就是正常的http调用即可。

            微信提供了一系列方法，对于我这次的场景来说有如下接口

    •         getTemplateList获取模板列表

      • POSThttps://api.weixin.qq.com/wxa/gettemplatelist?access_token==A CCESS_TOKEN

    •         addtotemplat移动草稿到模板库

      • POSThttps://api.weixin.qq.com/wxa/gettemplatelist?access_token=A CCESS_TOKEN

    •         deleteTemplat删除指定模板

      • POSThttps://api.weixin.qq.com/wxa/deletetemplate?access_token=A CCESS_TOKEN

    •         getTemplateDraftList获取草稿箱列表

      • https://api.weixin.qq.com/wxa/gettemplatedraftlist?access_token=A CCESS_TOKEN

            具体的微信开放平台文案请移步

            版本号的自动生成主要是通过在点击发布时候通过让用户选择发布的版本为“大版本”功能迭代”还是补丁修复”结合这里提到获取当前模板列表并用 AppID找到当前最近的版本号再做自动计算累加的方式得到这次发布的版本号。

    构建小程序

            构建小顺序这边就直接沿用 uni-app能力直接做构建。封装了如下方法去构建小程序

    //miniProgramService.t局部代码publicasyncbuildMPForLocenv:string:Promise{letbuildEnv;switchenv.toUpperCas{case"PROD":buildEnv=EnvEnum.prod;break;case"STA GING":buildEnv=EnvEnum.staging;break;case"TEST":buildEnv=EnvEnum.test;break;default:buildEnv=EnvEnum.dev;break;}constarg=`./node_modules/.bin/cross-envNODE_ENV=productDEPLOY_ENV=${buildEnv}UNI_PLA TFORM=mp-weixin./node_modules/.bin/vue-cli-servicuni-build`.split'';//正常需要这样传入 shell参数才行//[//'NODE_ENV=production',//'DEPLOY_ENV=staging',//'UNI_PLA TFORM=mp-weixin',//'./node_modules/.bin/vue-cli-service',//'uni-build'//]constoptions:MPExecOption={execFileNameOrPath:'node',cwd:getWorkspacePath};returnShell.execargs,option;}

            其余的功能

    • 剩余文件读取就正常使用 fs库的readFileSync方法去读取和修改
    • 撤销修改文件则是通过调用 Gitcheckout命令的能力去做，也是要使用上一章节的Git基本能力调用
    安排小程序

            build完成了怎么上传呢？微信小顺序这块还是需要借助微信开发工具的能力来上传

    微信开发工具上传

            首选我要先检查开发者工具设置：需要在开发者工具的设置 ->平安设置中开启服务端口这样我才干直接唤起开发者然后做些我要做的事情。

            再者我需要知道微信开发者工具的执行文件地址。正常来说 Mac地址

            /A pplications/wechatwebdevtools.app/Contents/MacOS/cli

            最后通过我以前提供的Shell命令能力去执行就搞定了不是很简单。也封装了miniProgram.t来做这个事情

    //miniProgram.t核心代码exportnamespacCmd{exportfunctionuploadMPoptions:MiniProgramExecOpt{constarg=['upload','--project',options.projectPath,'-v',options.userVersion,'-d',options.userDesc,];returnCore.execargs,option;}}}

            其余的功能

    • 移动到模板库和安排预览版直接调用微信开放平台 api即可

            效果预览图：

            

    尾声

            至此整个小程序部署的Vscode插件中实现的几个关键的技术点已经逐一做了简要的说明，大家会不会觉得其实看下来不难，就是涉及的东西会比较多。其实还有其他诸如整个构建流程方法如何可视化，Vscode插件里面的一些基础的能力等等在本文都没有详细提及。欢迎大家留言或者提问把自己想要知道的问题反馈给我也方便我可以针对大家的问题再去做一篇更棒的关于 Vscode插件开发的文章。

            其实 Vscode插件在整个开发提效场景中只是当中的一个环节，会以敦煌工作台为核心底座搭配 Chrome插件，Vscode插件，zoo-cli形成一个开发提效的百宝箱。Vscode插件更多的想给开发者们带来沉溺式开发体验。

            更多编程相关知识，请访问：编程视频！
    怎么用linux搭建论坛网站 南京网站制作多少钱一年

    地址 · ADDRESS

    地址：建邺区新城科技园嘉陵江东街18号2层

    邮箱：309474043@qq.Com

    点击查看更多案例

    联系 · CALL TEL

    400-8793-956

    售后专线：025-65016872

    业务QQ:309474043    售后QQ:1850555641

    南京网站建设|南京小程序开发|南京网站开发

    ©南京安优网络科技有限公司 版权所有   苏ICP备12071769号-4  网站地图

    友情链接： | 南京小程序开发 |