微信小程序 Linux开发环境设置详解

微信小程序 Linux开发环境

微信小程序开发工具是用nw.js实现的，这玩意本来就可以跨平台的。搞不懂为什么微信只出了windows和mac版。今天我捣腾了一下，可以在linux下开发微信小程序了。以ubuntu为例：

首先要安装nwjs sdk环境，因为需要devtool的支援, 一定要安装sdk版本。

下载nwjs sdk压缩包之后解压放到你喜欢的位置，并且设置环境变量，nw可执行文件加入到path变量中。

接下来要去提取微信小程序开发工具的package.nw文件，这是nwjs的项目包文件。找个window机器安装一下小程序开发工具，在安装目录里找到package.nw文件夹，将文件夹拷贝到linux系统下。按理来说，进入这个文件夹nw .就可以运行了，但是你会发现报错了，因为腾讯的开发者在项目的文件引用中大小写不分，能在windows上运行，linux下就不行。知道了原因，我们就将引用错误的地方修正。在package.nw目录下执行：

sed -i 's/\.\/Create\/create\.js/\.\/create\/create\.js/ig' app/dist/components/ContainController.js
sed -i 's/\.\/main\.js/\.\/Main\.js/ig' app/dist/components/ContainController.js
sed -i 's/\.\/webview\/Picker/\.\/webview\/picker/ig' app/dist/components/simulator/controller.js
sed -i 's/\.\/webview\/ActionSheet\.js/\.\/webview\/actionSheet\.js/ig' app/dist/components/simulator/controller.js
sed -i 's/appServiceConfig\.js/appserviceConfig\.js/ig' app/dist/common/assdk/networkSdk.js

执行完成之后进入目录：

nw .

可以正常打开小程序开发工具了，如果打开的时候提示“failed to load...”错误提示是因为图标文件无法加载的原因。你可以编辑一下package.json里面的"icon": "app/images/logo2.png"为其他ico文件或者直接删掉这一行即可。

补充：

在运行nw .之前需要npm install。

我本地还需要单独安装几个模块：

npm install --save autoprefixer
npm install --save pretty
npm install --save perfectionist

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

赞 (0)

相关推荐

  • 详解Linux 下开发微信小程序安装开发工具

    详解Linux 下开发微信小程序安装开发工具 1. git clone https://github.com/yuan1994/wechat_web_devtools 然后创建一个文件夹 mkdir /opt/tencent/ 移动文件 mv ./wechat_web_devtools /opt/tencent 修改用户组 chown -R root:root /opt/tencent/wechat_web_devtools 启动测试工具 /opt/tencent/wechat_web_devt

  • 微信小程序 Linux开发环境设置详解

    微信小程序 Linux开发环境 微信小程序开发工具是用nw.js实现的,这玩意本来就可以跨平台的.搞不懂为什么微信只出了windows和mac版.今天我捣腾了一下,可以在linux下开发微信小程序了.以ubuntu为例: 首先要安装nwjs sdk环境,因为需要devtool的支援, 一定要安装sdk版本. 下载nwjs sdk压缩包之后解压放到你喜欢的位置,并且设置环境变量,nw可执行文件加入到path变量中. 接下来要去提取微信小程序开发工具的package.nw文件,这是nwjs的项目包文

  • 微信小程序url与token设置详解

    微信小程序url与token设置详解

    微信小程序url与token设置详解 新浪云应用sae的代码里创建一个weixin.php文件,写入以下代码 define("TOKEN","myToken");// 后台填写的token,在微信公众平台启用 $wechatObj = new wechatAPI(); $wechatObj->isValid(); class wechatAPI { public function isValid()//验证微信接口,验证函数以外的代码和微信公众号开发token

  • 微信小程序Server端环境配置详解（SSL， Nginx HTTPS，TLS 1.2 升级）

    微信小程序Server端环境配置详解（SSL， Nginx HTTPS，TLS 1.2 升级）

    微信小程序Server环境配置详解 主要内容: 1. SSL免费证书申请步骤 2. Nginx HTTPS 配置 3. TLS 1.2 升级过程 微信小程序要求使用 https 发送请求,那么Web服务器就要配置成支持 https,需要先申请SSL证书 小程序也要求 TLS(传输层安全协议)的版本至少为 1.2,在配置好 https之后,如果 TLS 的版本较低,就涉及到升级问题 所以 Server端环境配置的主要步骤: 申请 SSL 证书 配置web服务器支持https(我使用的是nginx)

  • 微信小程序支付及退款流程详解

    首先说明一下,微信小程序支付的主要逻辑集中在后端,前端只需携带支付所需的数据请求后端接口然后根据返回结果做相应成功失败处理即可.我在后端使用的是php,当然在这篇博客里我不打算贴一堆代码来说明支付的具体实现,而主要会侧重于整个支付的流程和一些细节方面的东西.所以使用其他后端语言的朋友有需要也是可以看一下的.很多时候开发的需求和相应问题的解决真的要跳出语言语法层面,去从系统和流程的角度考虑.好的,也不说什么废话了.进入正题. 一. 支付 支付主要分为几个步骤: 前端携带支付需要的数据(商品id,购

  • 微信小程序 本地数据存储实例详解

    微信小程序 本地数据存储实例详解 前言 如果您在看此文章之前有过其他程序的开发经验,那一定会知道一般例如安卓或者苹果的原生APP都提供了本地的存储功能,甚至可以使用sqlite数据库来做存储.可是微信的小程序框架基于微信本身,其实际运行环境只是在浏览器里面,所以不会提供那么丰富的数据存储实力.但html5开始已经可以在浏览器里面存储数据,好在微信的小程序给这个功能封装好了,这样我们可以使用数据存储. 每个微信小程序都可以有自己的本地缓存,可以通过 wx.setStorage(wx.setStor

  • 微信小程序访问mysql数据库流程详解

    微信小程序访问mysql数据库流程详解

    目录 1 开通云上的mysql 2 创建自定义连接器 3 创建云函数 4 安装依赖 5 出参映射 6 在小程序中使用连接器 总结 1 开通云上的mysql 经过询价,我发现阿里云的数据库是比较便宜的,新人购买非常划算.对于爱学习的博主来说,果断购买一个. 按照操作指引购买后,云会帮你创建一系列的环境,在控制台就可以看到属于自己的实例 点击操作列上的管理,就可以创建我们自己的数据库.配置的步骤是先创建数据库的账号 然后创建一个数据库 都设置好之后就可以登录数据库,创建表,加数据了 刚创建好的数据库

  • 微信小程序全局文件的使用详解

    微信小程序全局文件的使用详解

    目录 全局文件 总结 我们前边两篇介绍了账号的申请.注册,工具的安装,云服务的开通.本篇我们介绍一下基础语法.介绍的方法呢我们会结合上微搭低代码的工具一起做个对比.因为低代码工具也产生了非常多的技术概念,但最终在发布成小程序的时候也是按照微信的规范去生成的,把微信开发者工具学会了也可以更深入的了解低代码的相关概念. 全局文件 小程序中是分为全局和页面级两部分.全局是在小程序的所有页面都有效,页面级是只在当前页面中生效.小程序根目录有三个文件app.js.app.json.app.wxss这三个就

  • 微信小程序-getUserInfo回调的实例详解

    微信小程序-getUserInfo回调的实例详解

    微信小程序-getUserInfo回调的实例详解 前言: 这里就不吹嘘微信小程序有多厉害了,毕竟也不是我写的,直接谈谈我在做小程序开发时遇到的奇异Bug. getUserInfo多次调用: 对于wx.getUserInfo应该很多开发者都用过,用于获取用户基本信息,前提是需要用户授权,如果用户先前没有授权,则弹出一个提示框如下: 点击允许后,我们就能拿到用户信息,再进行后面的一系列操作.这一切看起来都是那么美好,可是在某次运行中,点允许授权后,程序并没有按照我们的预期往下执行.最后发现在其他的地

  • 微信小程序 合法域名校验出错详解及解决办法

    微信小程序 合法域名校验出错详解及解决办法

    微信小程序 合法域名校验出错详解及解决办法 看下出现错误: 微信小程序开发,遇到这个问题怎么办? 产生原因是因为发起了wx.request请求 而请求的域名没有在微信公众平台后台设置. 1.开发者自己手动设置不检验 不管你有没有拿到App ID ,我相信很多人都会和我一样做一件事,就是二话不说先大概了解下文档,然后直接上github找项目,导入试试.我是这么做的,结果上来就报这个错,后来发现其实可以自己设置本地开发工具不校验域名,完全没有影响. 在"项目">最后一个选项,勾选之后

  • 微信小程序 同步请求授权的详解

    微信小程序 同步请求授权的详解 需求分析: 1.在小程序首次打开的时候,我需要同时请求获取多个权限,由用户逐一授权. (['scope.userInfo','scope.userLocation','scope.address','scope.record','scope.writePhotosAlbum']) 问题分析: 1. wx.authorize接口同时调用,请求多个权限,由于异步原因,将授权请求一并发出,显然不符合要求. 2. promise能很好的解决问题,试着尝试了一下,下面代码分

随机推荐