


Detailed introduction to WeChat applet download tools and debugging
Late yesterday, the WeChat team released WeChat Mini Program Developer Tools, WeChat Mini Program Development Documents and WeChat Mini Program Design Guide. Brand-new developer tools integrate development and debugging, code editing and program release functions to help Developers can develop WeChat mini programs simply and efficiently. The following is the official document, which contains the download address of the mini program developer tools and debugging guide.
Download address: Developer tools version 0.9.092300
windows version 64; windows version 32; mac version
In order to help developers develop WeChat applets simply and efficiently, we launched It has a new developer tool that integrates functions such as development and debugging, code editing, and program release.
devtools
Scan code to log in
When starting the tool, developers need to use the WeChat ID that has been successfully bound in the background to scan the QR code to log in. All subsequent All operations will be based on this WeChat account
There are three main functional areas for program debugging: simulator, debugging tools and small program operation area
Simulator
Simulator Simulates the real logical performance of the WeChat applet on the client, and can present the correct state on the simulator for most APIs.
emulat
Debugging tool
The debugging tool is divided into 6 functional modules: Wxml, Console, Sources, Network, Appdata, Storage and
3Wxml Pannel
Wxml Pannel is used to help developers develop Wxml converted interfaces. Here you can see the real page structure and the wxss attributes corresponding to the structure. At the same time, you can modify the corresponding wxss attributes and see the modifications in the simulator in real time. Through the selector in the upper left corner of the debugging module, you can also quickly find the wxml code corresponding to the component in the page.
wxml
Sources Pannel
Sources Pannel is used to display the script files of the current project. Different from browser development, the WeChat applet framework will compile the script files, so in The files developers see in the Sources Pannel are processed script files. The developer's code will be wrapped in the define function, and for the Page code, there will be an active call to require at the end.
sources
Network Pannel
Netwrok Pannle is used to observe and display request and socket request status
network
Appdata Pannel
Appdata Panel is used to display the current appdata specific data of the current project and provide real-time feedback on the project data. The data can be edited here and fed back to the interface in a timely manner.
appdata
Storage Pannel
Storage Pannel is used to display the data storage status of the current project after using wx.setStorage or wx.setStorageSync.
storage
Console Pannel
Console Pannel has two major functions:
Developers can enter and debug code here
console
The error output of the mini program will be displayed here
4 Mini program operation area
The mini program operation area helps developers simulate some client environment operations. For example, when the user returns to the chat window from the mini program, an API set to the background of the mini program will be triggered.
5When the mini program uses multiple windows, you can switch pages in the top operation area. It should be noted that this operation only exists for the convenience of developers. It will not be available in the real WeChat client.
The editing area can be used to write code for the current project, and at the same time, basic addition, deletion and renaming of files can be performed.
The tool currently provides four types of file editing: wxml wxss js json
Auto-completion
Like most editors, we provide complete auto-completion
Commonly used shortcut keys
Format adjustment
Ctrl+S: Save file
Ctrl+[, Ctrl+]: Code line indentation
Ctrl+Shift+[, Ctrl+Shift+]: Fold and open the code block
Ctrl+C Ctrl+V: Copy and paste, if no text is selected, copy and paste a line
Shift+Alt+F: Code formatting
Alt+Up, Alt+Down: Move a line up and down
Shift+Alt+Up, Shift+Alt+Down: Copy a line up and down
Ctrl+Shift+Enter: Insert a line above the current line
Cursor related
Ctrl+End: Move to the end of the file
Ctrl+Home: Move to the beginning of the file
Ctrl+i: Select the current line
Shift+End: Select from the cursor to the end of the line
Shift+Home: Select from the beginning of the line to the cursor
Ctrl+Shift+L: Select all matches
Ctrl+D: Select matches
Ctrl+U: Cursor rollback
The project directory displays some details of the current project, including icons, appid, directory information, etc.
Click on the preview function, the tool will automatically compile and build the code, and generate a code package to upload to the WeChat server. After success, a QR code will be displayed. Developers can use the new version of WeChat to scan the QR code on their mobile phones. See the real performance of the corresponding project on
It should be noted that during the internal testing period, the code upload function is only operable by the administrator’s WeChat ID.
The above is the compilation of information for debugging the WeChat applet download tool. Related information will be added later. Thank you for your support of this site!
For more detailed introduction to WeChat applet download tools and debugging related articles, please pay attention to the PHP Chinese website!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics











Xianyu's official WeChat mini program has quietly been launched. In the mini program, you can post private messages to communicate with buyers/sellers, view personal information and orders, search for items, etc. If you are curious about what the Xianyu WeChat mini program is called, take a look now. What is the name of the Xianyu WeChat applet? Answer: Xianyu, idle transactions, second-hand sales, valuations and recycling. 1. In the mini program, you can post idle messages, communicate with buyers/sellers via private messages, view personal information and orders, search for specified items, etc.; 2. On the mini program page, there are homepage, nearby, post idle, messages, and mine. 5 functions; 3. If you want to use it, you must activate WeChat payment before you can purchase it;

Implementing picture filter effects in WeChat mini programs With the popularity of social media applications, people are increasingly fond of applying filter effects to photos to enhance the artistic effect and attractiveness of the photos. Picture filter effects can also be implemented in WeChat mini programs, providing users with more interesting and creative photo editing functions. This article will introduce how to implement image filter effects in WeChat mini programs and provide specific code examples. First, we need to use the canvas component in the WeChat applet to load and edit images. The canvas component can be used on the page

To implement the drop-down menu effect in WeChat Mini Programs, specific code examples are required. With the popularity of mobile Internet, WeChat Mini Programs have become an important part of Internet development, and more and more people have begun to pay attention to and use WeChat Mini Programs. The development of WeChat mini programs is simpler and faster than traditional APP development, but it also requires mastering certain development skills. In the development of WeChat mini programs, drop-down menus are a common UI component, achieving a better user experience. This article will introduce in detail how to implement the drop-down menu effect in the WeChat applet and provide practical

WeChat applet implements picture upload function With the development of mobile Internet, WeChat applet has become an indispensable part of people's lives. WeChat mini programs not only provide a wealth of application scenarios, but also support developer-defined functions, including image upload functions. This article will introduce how to implement the image upload function in the WeChat applet and provide specific code examples. 1. Preparatory work Before starting to write code, we need to download and install the WeChat developer tools and register as a WeChat developer. At the same time, you also need to understand WeChat

The official WeChat mini program of Xianyu has been quietly launched. It provides users with a convenient platform that allows you to easily publish and trade idle items. In the mini program, you can communicate with buyers or sellers via private messages, view personal information and orders, and search for the items you want. So what exactly is Xianyu called in the WeChat mini program? This tutorial guide will introduce it to you in detail. Users who want to know, please follow this article and continue reading! What is the name of the Xianyu WeChat applet? Answer: Xianyu, idle transactions, second-hand sales, valuations and recycling. 1. In the mini program, you can post idle messages, communicate with buyers/sellers via private messages, view personal information and orders, search for specified items, etc.; 2. On the mini program page, there are homepage, nearby, post idle, messages, and mine. 5 functions; 3.

Use the WeChat applet to achieve the carousel switching effect. The WeChat applet is a lightweight application that is simple and efficient to develop and use. In WeChat mini programs, it is a common requirement to achieve carousel switching effects. This article will introduce how to use the WeChat applet to achieve the carousel switching effect, and give specific code examples. First, add a carousel component to the page file of the WeChat applet. For example, you can use the <swiper> tag to achieve the switching effect of the carousel. In this component, you can pass b

To implement the picture rotation effect in WeChat Mini Program, specific code examples are required. WeChat Mini Program is a lightweight application that provides users with rich functions and a good user experience. In mini programs, developers can use various components and APIs to achieve various effects. Among them, the picture rotation effect is a common animation effect that can add interest and visual effects to the mini program. To achieve image rotation effects in WeChat mini programs, you need to use the animation API provided by the mini program. The following is a specific code example that shows how to

Implementing the sliding delete function in WeChat mini programs requires specific code examples. With the popularity of WeChat mini programs, developers often encounter problems in implementing some common functions during the development process. Among them, the sliding delete function is a common and commonly used functional requirement. This article will introduce in detail how to implement the sliding delete function in the WeChat applet and give specific code examples. 1. Requirements analysis In the WeChat mini program, the implementation of the sliding deletion function involves the following points: List display: To display a list that can be slid and deleted, each list item needs to include
