本博客已暂停更新,需要请转新博客http://www.whbwiki.com/231.html

配置 VsCode 微信小程序开发环境并非不用官方的 微信小程序开发者工具 ,而是两者配合适用,可以极大的提高我们的开发效率。

安装微信小程序开发者工具

下载地址:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

根据自己的系统下载对应版本,然后一直点击下一步安装即可。

安装VsCode

下载地址:https://code.visualstudio.com/

如下图选择适合自己系统的下载之后安装就行

注意:建议直接安装在C盘,方便配置,软件大小本身不大!!!

注意:一定要将 添加到PATH 这项打钩!!!

安装开发必备插件

  1. Easy less 支持使用less语法 ,因为微信小程序开发者工具不支持less ,所以要配合使用

  1. 微信小程序开发者工具插件,开发必备

配置Less

快捷键command+逗号打开用户设置,搜 less.complie, 点击编辑添加到右边,设置commpress是否开启压缩,sourceMap是否生成.map文件。配置如下图

"less.compile": {

        "outExt": ".wxss"
},
"[less]": { "editor.suggest.insertMode": "replace"
}

结束

至此,开始开发你的小程序吧!!!

VSCode 微信小程序 开发环境配置 详细教程的更多相关文章

  1. 微信小程序 开发环境配置

    1.注册小程序 (1)微信公众平台:https://mp.weixin.qq.com/(2)立即注册 (3)流程 (4)小程序注册 (5)填写相关信息,并去邮箱激活.这样小程序的账号就注册完成了. 2 ...

  2. 微信小程序开发——全局配置详细介绍

    本文针对官方文档未说明清楚的进行详细探索研究,官方文档详见:全局配置 . pages: 删除页面,需要先删除app.json中pages对应页面的路径,再去删除页面相关的所有文件,不然会出现页面文件混 ...

  3. 微信小程序开发环境安装以及相关设置配置

    微信小程序开发环境安装以及相关设置配置 一.安装 软件名称:wechat_devtools_1.02.1907232_x64 软件安装地址:https://developers.weixin.qq.c ...

  4. VSCode Java 开发环境配置 详细教程

    VSCode Java 开发环境配置 详细教程 配置java 下载 用于现在大多数使用者用的是java 8,小白的我先安装java 8好了,^ w ^. 下载地址:Java 8 | Java SE 打 ...

  5. 关于微信小程序开发环境苹果IOS真机预览报SSL协议错误问题解决方案

                              微信小程序开发环境苹果IOS真机预览报SSL协议错误问题 原文来自:https://blog.csdn.net/qq_27626333/articl ...

  6. 微信小程序开发环境

    微信小程序开发环境 不忘初心,方得始终.初心易得,始终难守 小程序开发环境 开发工具下载地址:https://developers.weixin.qq.com/miniprogram/dev/devt ...

  7. VSCode PHP 开发环境配置 详细教程

    VSCode PHP 开发环境配置 详细教程 这篇文章主要介绍了VScode+PHPstudy配置PHP开发环境的步骤,整理了官方以及优秀第三方的内容,对于学习和工作有一定借鉴意义. 配置过程 第一步 ...

  8. 利用python实现微信小程序游戏跳一跳详细教程

    利用python实现微信小程序游戏跳一跳详细教程 1 先安装python 然后再安装pip <a href="http://newmiracle.cn/wp-content/uploa ...

  9. PyCharm Django Python 开发环境配置 详细教程

    PyCharm Django Python 开发环境配置 详细教程 1. Python 下载及安装 (1)根据需要的版本去 Python 官网(https://www.python.org/downl ...

随机推荐

  1. 送你一个Python 数据排序的好方法

    摘要:学习 Pandas排序方法是开始或练习使用 Python进行基本数据分析的好方法.最常见的数据分析是使用电子表格.SQL或pandas 完成的.使用 Pandas 的一大优点是它可以处理大量数据 ...

  2. Docker安装ElasticSearch5.6.8

    前言 因实验室项目需要,准备docker安装个ES , 使用TransportClient练练手,然后死活连接不上 环境准备 系统:centos7 软件:docker ElasticSearch版本: ...

  3. vue 移动端项目切换页面,页面置顶

    之前项目是pc端是使用router的方式实现置顶的 //main.js router.afterEach((to, from, next) => { window.scrollTo(0, 0) ...

  4. ch_nginx.sh

    #!/bin/bash counter=`ps -ef |grep nginx |grep -v grep | wc -l` if [ $counter = 0 ];then service ngin ...

  5. 分片利器 AutoTable:为用户带来「管家式」分片配置体验

    在<DistSQL:像数据库一样使用 Apache ShardingSphere>一文中,Committer 孟浩然为大家介绍了 DistSQL 的设计初衷和语法体系,并通过实战操作展示了 ...

  6. spoj2 prime1 (区间筛)

    给定t组询问,每组询问包括一个l和r,要求\([l,r]\)的素数有哪些 其中\(t \le 10,1 \le l \le r \le 1000000000 , r-l \le 100000\) Qw ...

  7. 用C++实现的数独解题程序 SudokuSolver 2.3 及实例分析

    SudokuSolver 2.3 程序实现 用C++实现的数独解题程序 SudokuSolver 2.2 及实例分析 里新发现了一处可以改进 grp 算法的地方,本次版本实现了对应的改进 grp 算法 ...

  8. 使用YApi搭建API接口管理工具(docker安装)

    使用YApi搭建API接口管理工具(docker安装) 工具描述 YApi 是高效.易用.功能强大的 api 管理平台,旨在为开发.产品.测试人员提供更优雅的接口管理服务.可以帮助开发者轻松创建.发布 ...

  9. 浅尝装饰器-@staticmethod 和@classmethod

    [写在前面] 本帖归属于装饰器单元的学习,可以点击关键词'装饰器'查看其他博文讲解 [正文部分] 说到装饰器一开始我觉得很陌生,看了一下别人的博客讲解,原来以前学习遇到的静态方法@staticmeth ...

  10. 在Windows上使用Docker 创建MongoDB 副本集的极简方法(翻译)

    这篇博客介绍下在Windows上使用Docker 创建MongoDB 三节点副本集的最简单的方法.以下命令需要Docker for Windows并使用Linux 容器. 1: 为每个节点创建数据卷 ...