首页
Python
Java
IOS
Andorid
NodeJS
JavaScript
HTML5
【
微信小程序(一)-工具创建和结构配置说明 Stable Build
】的更多相关文章
微信小程序(一)-工具创建和结构配置说明 Stable Build
按装前特别说明: windows最好下载32位的,不然用到用到后面就出现"网络连接失败",然后就登录不上去了,打不开编辑器了! 问题 : 微信开发者工具网络连接失败, "网络连接失败"error:unable to verify the first certificate 的提示. 解决办法 : 就是按装32位,然后重启,将设置中的代理设为"不使用任何代理,勾选后直链网络",如果还不行,重复上面的操作,卸载,再装,启动,设置,再重启电脑,再启动…
从微信小程序开发者工具源码看实现原理(一)- - 小程序架构设计
使用微信小程序开发已经很长时间了,对小程序开发已经相当熟练了:但是作为一名对技术有追求的前端开发,仅仅熟练掌握小程序的开发感觉还是不够的,我们应该更进一步的去理解其背后实现的原理以及对应的考量,这可能会解释我们在开发过程中遇到的一些疑惑,比如为啥小程序不能操作dom.小程序是web技术渲染还是native技术渲染等等,另一方面对于我们个人成长也是有帮组的. 首先声明下,文章查看小程序开发者工具源码的方法仅限学习使用. 本文将从以下几个方面来说一下小程序的实现原理 如何查看小程序开发者工具源码 小…
微信小程序开发工具测评
1月9日微信小程序正式上线.很多企业都希望能在这个.但是在技术开发的问题上,却不知道该如何下手.经过一些程序员不辞辛苦连夜测试,终于从十余款工具呕心沥血筛选出四款比较靠谱实用的微信小程序开发工具.接下来一起来看看测评吧. 一.微信小程序官方开发工具 注意,它只是个工具,而不是一个IDE.官方工具中的代码编辑功能,就是将vscode的代码编辑功能嵌入到工具中,不足以支撑开发. 优点 因为是官方工具所以有这其它第三方工具有这不可比拟的天然优势,如果不是他代码编辑功能太弱的话. 官方工具,可调试,可预…
微信小程序开发工具使用与设计规范(二)
[未经作者本人同意,请勿以任何形式转载] 上一篇文章主要分析了微信小程序应用场景和优劣势.本篇你可以学习到: 如何使用小程序开发工具写一个Hello World 微信小程序设计规范 微信小程序项目结构 >>>微信小程序开发工具使用 下载安装小程序 下载 :微信web开发者工具 下载:官方DEMO源码 本系列教程使用的是mac版的开发者工具. 安装完成后,打开微信web开发者工具 1.扫码登录,绑定个人微信 2.扫码登录后,新建或导入已有项目(这里使用官方提供的DEMO源码quicksta…
从微信小程序开发者工具源码看实现原理(四)- - 自适应布局
从前面从微信小程序开发者工具源码看实现原理(一)- - 小程序架构设计可以知道,小程序大部分是通过web技术进行渲染的,也就是最终通过浏览器的dom tree + cssom来生成渲染树:既然最终是通过css来绘制ui布局,我们知道小程序提供的自适应css单位rpx在浏览器环境根本不被识别,那么猜测小程序最终是将rpx单位转化为浏览器识别的css长度单位,到底是怎么转化的呢,本节就来探讨一下转化机制. 小程序样式转换 在从微信小程序开发者工具源码看实现原理(二)- - 小程序技术实现中可以知道,…
5款微信小程序开发工具使用报告,微信官方开发工具还有待提升
微信小程序已经内测有一段时间了,笔者本着好奇加学习的心态写了几个小demo,虽然在MINA框架上并没有遇到太多的坑,但官方开发工具实在不敢恭维. api提示不全,要一个个查api啊,写代码超级慢啊 很多必备的快捷键都没有,比如全选关键字.快速复制一行等等 颜色主题不能选?不喜欢白色风格怎么搞 没有插件 没有插件 没有插件 重要的事情说三遍 无奈笔者走上了尝试各种IDE的旅途,现在说一下笔者对于IDE的需求或者设想: 轻量级:我不喜欢那种类似Eclipse的庞然大物,即使出现类似工具我也不会去使用…
微信小程序开发工具的数据,配置,日志等目录在哪儿? 怎么找?
原文地址:http://www.wxapp-union.com/portal.php?mod=view&aid=359 本文由本站halfyawn原创:感谢原创者:如有疑问,请在评论内回复 还是先把问题列出来,让问题来驱动探索: 微信小程序开发工具的数据,配置,日志等目录在哪儿? 怎么找? 首先分析了一下源码,日志目录应该同NW.JS的应用目录相关,,,查查查,,一直查到NW.JS的C++源码,搞得太复杂,大概知道位置,但还是不确切.决定不往这条线找,换另一条路: 把日志文件修改输出到我指定…
微信小程序开发工具中快捷键
微信小程序开发工具表面上是没有更多的样式类的工具,例如缩进.隐藏代码什么的. 现在总结一下小程序开发工具常用的一些快捷键: 格式调整 Ctrl+S:保存文件Ctrl+[, Ctrl+]:代码行缩进Ctrl+Shift+[, Ctrl+Shift+]:折叠打开代码块Ctrl+C Ctrl+V:复制粘贴,如果没有选中任何文字则复制粘贴一行Shift+Alt+F:代码格式化Alt+Up,Alt+Down:上下移动一行Shift+Alt+Up,Shift+Alt+Down:向上向下复制一行Ctrl+Sh…
ubuntu系统安装微信小程序开发工具
在ubuntu系统中安装微信小程序开发工具之前,先要安装wine与git 一.安装wine 1.如果您的系统是64位,启用32位架构(如果您还没有) sudo dpkg --add-architecture i386 2.添加仓库 wget -nc https://dl.winehq.org/wine-builds/Release.key sudo apt-key add Release.key sudo apt-add-repository https://dl.winehq.org/wine…
微信小程序开发工具
微信小程序 1● 工具下载 https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 2● webchart_devtolls安装 3● 微信公众平台 https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 4● 注册appid https://mp.weixin.qq.com/wxopen/waregister?act…
微信小程序:工具配置 project.config.json
微信小程序:工具配置 project.config.json 一.项目配置文件project.config.json 小程序开发者工具在每个项目的根目录都会生成一个 project.config.json,在工具上做的任何配置都会写入到这个文件,当重新安装工具或者换电脑工作时,只要载入同一个项目的代码包,开发者工具就自动会帮你恢复到当时你开发项目时的个性化配置,其中会包括编辑器的颜色.代码上传时自动压缩等等一系列选项. 可以在项目根目录使用 project.config.json 文件对项目进行…
解决Mac版微信小程序开发工具打开后无法显示二维码
问题描述: 正常情况下,打开微信小程序开发工具后,首页提示扫描二维码进行登陆,但是如果不显示二维码,当然无法登陆. 解决方案: 无法显示二维码肯定是程序运行哪里出错了,我们直接点击桌面图标是无法排查错误,所以需要切换至命令行进行启动. 打开命令行,进入如下目录 /Applications/wechatwebdevtools.app/Contents/MacOS 执行目录下的程序 ./wechatwebdevtools 显示错误信息如下 [827:32515:0325/101822.447917:…
解决微信小程序开发者工具输入框焦点问题
Windows10笔记本上运行微信小程序开发者工具,输入框(input,textarea)没有焦点,只能在真机调试,效率太低.后来发现是Window10对笔记本高分屏支持不好,要DPI缩放,导致兼容性问题.解决方法: 显示设置.缩放与布局改为100%.这样就可以点击输入框了,但是字体变得很小,最好是外接显示器. 不修改DPI缩放,长按输入框即可!…
微信小程序基础之创建使用教程
本文档将带你一步步创建完成一个微信小程序,并可以在手机上体验该小程序的实际效果.这个小程序的首页将会显示欢迎语以及当前用户的微信头像,点击头像,可以在新开的页面中查看当前小程序的启动日志. 1. 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的"设置"-"开发者设置"中,查看到微信小程序的 AppID 了,注意不可直接使用服务号或订阅号的 AppID .(一般这个AppID需要公司营业许可证,还必须要缴费才可获得…
微信小程序第3课 目录结构及小知识点
目录 目录结构 安装包下载地址 一.pages目录介绍 二.index目录介绍 index.js(相当JavaScript文件,必不可少的) index.json(可以不需要) index.wxml(相当于html文件,必不可少的) index.wxss(相当于html里的css,可以不需要) 三.utils目录 四.app.js.app.json.app.wxss app.js app.json app.wxss 创建新的文件夹 方法一: 方法二: 目录结构 当我们打开一个微信小程序项目后,点…
从微信小程序开发者工具源码看实现原理(二)- - 小程序技术实现
wxml与wxss的转换 1.wxml使用wcc转换 2.wxss使用wcsc转换 开发者工具主入口 视图层页面的实现 视图层页面实现技术细节 视图层快速打开原理 视图层新打开页面流程 业务逻辑层页面的实现 wxml与wxss的转换 打开小程序开发者工具,在调试控制台输入openVendor就会打开小程序的WeappVendor目录,该目录包括以下几个主要内容: wcc可执行程序,用于将wxml内容转换为js内容,执行方式:wcc xxx.wxml wcsc可执行程序,用于将wxss内容转换为视…
微信小程序开发者工具详解
一.微信小程序web开发工具下载地址 1.1 在微信公众平台-小程序里边去下载开发工具下载地址. 1.2 下载后安装一下就可以使用了: 二.创建项目 2.1 微信小程序web开发工具需要扫码登陆,所以必须先绑定开发者才可以: 2.2 已经绑定的开发者可以创建项目,需要填写AppID.项目名称.本地开发目录. AppID需要去设置里边获取,如果不填的话官方给的提示是部分功能受限: 三.开发工具界面介绍: 1. 编辑:开发的时候,需要到编辑区去写代码 2. 调试:开发完需要调试程序的时候需要切换到这…
iKcamp出品|微信小程序|工具安装+目录说明|基于最新版1.0开发者工具初中级教程分享
iKcamp官网:http://www.ikcamp.com 访问官网更快阅读全部免费分享课程:<iKcamp出品|全网最新|微信小程序|基于最新版1.0开发者工具之初中级培训教程分享>. 包含:文章.视频.源代码 第一章:小程序初级入门教程 工具安装 在上一节第 8 步所展示的页面中,可以点击 开发者工具 直接进入到下载页面,也可以直接访问 官网下载地址.然后根据自己的设备选择相应的下载 安装过程不再复述,一路默认. 下载开发工具 § 小程序工具起手 此教程选择的工具为 mac 平台版本,没…
从微信小程序开发者工具源码看实现原理(三)- - 双线程通信
文章概览: 引言 小程序开发者工具双线程通信的设计 1.on: 用来收集小程序开发者工具触发的事件回调 2.invoke:以api方式调用开发工具提供的基础能力 3.publish:用来向Appservice业务层发送消息 4.subscribe: 用来收集Appservice业务逻辑层触发的事件回调 小程序开发者工具双线程通信的实现 view层向Appservice层的通信过程(以事件为例说明) 1.view层:模板引擎解析wxml上绑定的事件,并为组件元素绑定事件 2.view层:用户行为触…
Archlinux下安装微信小程序开发工具
由于微信小程序没有Linux版本,所以需要用wine来跑 一.安装wine sudo pacman -S wine 二.安装nwjs-sdk 微信开发工具包基于nwjs-sdk #没有wget就先安装wget#可以去https://dl.nwjs.io下载最新版 wget https://dl.nwjs.io/v0.36.0/nwjs-sdk-v0.36.0-linux-x64.tar.gz #解压 tar -xvf nwjs-sdk-v0.25.4-linux-x64.tar.gz #切换目录…
微信小程序,工具未检测合法域名,400 (Bad Request)错误
1.工具未检测合法域名 这个我就不多说了,如果你新建的时候没有填写AppID的话这个我就不太清楚了 如果新建项目的时候填写了AppID的话,出现这种错误,那你应该去小程序后台 设置->开发者设置->服务器域名 配置你的服务器,这里需要注意,一个月只能修改五次,所以慎重! 这里是小程序开发手册里的配置流程 2.小程序400 (Bad Request)错误 今天写小程序的时候,请求了一个接口,出现问题如下: 查阅了一下资料,发现如下问题 原始代码: wx.request({ url:API_URL…
微信小程序开发工具下载以及安装教程
微信公众平台上登录你的微信小程序账号 登录进入小程序开发-工具-下载,再根据你的系统选择相对应的版本地址进行下载. 以管理员身份运行下载,点击下一步,如图所示: 下一步,就会出现许可证协议,选择我接受.如图所示: 选定安装位置,浏览,选择桌面,点击安装,如图所示: 正在安装,如图所示: 安装完成…
微信小程序开发工具的基本应用
全局配置: 1.1配置所有页面路径:在app.json的{pages:[配置所有页面]},将首页放置在第一位,在app.json必须写上所有页面的路径,要不然会报错,每个页面的wxss样式文件只在当前文件里有效 1.2设置tabBar导航: "tabBar": { "color": "#7A7E83",//字体颜色 "selectedColor": "#3cc51f",//选中时候字体的颜色 "b…
微信小程序之工具js封装与使用
工具库的创建与使用 创建一个common文件夹 在common文件夹中创建一个utils文件夹 在utils文件夹中创建util.js // 工具 function tool() { console.log('i am a tool function.'); } module.exports = { tool: tool } 在具体的页面js中调用 首先要引入工具文件 const util = require('../../common/utils/util'); 然后在具体的位置使用即可. o…
微信小程序开发者工具构建npm提示没找到node_modules目录
一.官网给的文档写的不够充分,需要你充分理解npm的使用方法,才能明白的: 二.第一步:先在你电脑上安装npm 参考下面文章 https://www.cnblogs.com/zmdComeOn/p/11543441.html 三.第二步: 1.第一步:打开终端 cd 到项目目录下 输入如下命令: npm init 如下图所示 输入命令后一直点回车,如下图: 2.第二步:输入如下命令 npm install --production 3.第三步:输入如下命令 npm i vant-weapp -S…
微信小程序WEB工具安装
1.下载工具链接:http://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html?t=201715 2.安装完成后图片样式如图: 3.新建项目 说明:选择目录的时候尽量新建微信独立的工作空间[个人习惯] 4.打开项目效果图如下…
微信小程序开发者工具更新后报很多错误
很有可能是不小心改动微信开发者工具的基础库版本了, 在文件 project.config.json 中 "libVersion": "2.9.3", 变成 "libVersion": "2.0.2",…
linux下安装微信小程序开发工具
一.环境:: ubuntu 16.04 二.安装过程: 2.1 安装wine sudo apt-get install wine 2.2 安装nwjs-sdk 2.2.1 下载linux版nwjs-sdk wget https://dl.nwjs.io/v0.25.4/nwjs-sdk-v0.25.4-linux-x64.tar.gz 2.2.2 解压nwjs-sdk tar xvf nwjs-sdk-v0.25.4-linux-x64.tar.gz 2.2.3 切换到nwjs-sdk对应的目…
微信小程序 - Util工具类
/utils/utils.js 已经扩展到App对象中,Page方法中直接使用 app.util.method(...) 调用. 1. 扩展String.replaceAll JS默认值提供replace,定义为替换第一个匹配的规则 replaceAll 使用正则, replaceAll = function (FindText/*这里支持正则写法*/, RepText) 2. util.log 封装了console.log , 可以在全局配置中,禁止日志, 线上环境默认禁止 …
微信小程序开发工具调试没问题,真机调试Provisional headers are shown
from: https://blog.csdn.net/github_38928905/article/details/83105523 在开发工具调试,请求正常没问题,使用真机调试,请求异常:Provisional headers are shown 找了很多原因,多数说是后台配置问题,但是如果是这样,开发工具不是也该一样问题? 后面发现在开发调试工具中,我将 项目设置中的 选项"不校验合法域名.web-view(业务域名).TLS 版本以及 HTTPS 证书"勾选中了,去掉勾选后,…