How to preview a page in WeChat Developer Tools

How to see the preview of small program PC in WeChat developer tools?


First click on the settings menu at the top, as shown below

Please click to enter a picture description

Then click on General Settings, as shown below

Please click to enter a picture description

Then choose to launch the automatic preview of the PC, as shown below

Please click to enter the picture description

Then click the preview button of the applet, as shown below

Please click to enter the picture description

Switch to the automatic preview, and click to compile and preview, as shown in the following picture

Please click to enter the picture description

Next you can see the preview interface of the small program in your PC WeChat, as shown in the following picture

Please click to enter the picture description

WeChat Developer Tool data is displayed on your phone

WeChat Developer Tool data can be displayed on your phone.

WeChat Developer Tool is a very useful tool that helps developers to develop and debug WeChat applets on the computer side. But in the actual development, we need to always pay attention to the small program in the mobile terminal to ensure that the small program can run normally. Therefore, the WeChat developer tool provides a mobile preview function, which can synchronize the small program data in the developer tool to the cell phone for preview and debugging, so as to facilitate real-time debugging by developers.

To display the WeChat developer tool data on your phone, you need to open the WeChat developer tool, then click on the “Preview” button in the lower left corner, scan the QR code that pops up, and open it on your phone. At this time, the developer tool in the small program data will be synchronized to the phone for preview and debugging.

In short, through the WeChat developer tools, we can easily carry out the development and debugging of small programs, while the mobile preview function allows us to understand the small program in real time on the mobile side of the operation, to accelerate the development efficiency.

It should be noted that in order to ensure the preview effect, please make sure that the phone and computer are on the same LAN, and the WeChat version should be 6.7.2 and above. Also, if the preview is unstable, try restarting the WeChat developer tool and your phone, or update your WeChat version.

WeChat small program only write page and style how to preview

“Small program development assistant” officially released also, support WeChat small program page and style online preview. Previously, to preview the small program after development or testing, you must scan the code in the developer tool or management background. Now you can open it directly in the small program development assistant, and the operation speed of the preview small program will be greatly improved in the future.

In addition, the Tencent cloud service within the developer tool now supports PHP language on top of the original NodeJS environment. Developers can use WeChat developer tools, new or replaced with PHP language environment to continue development. And for PHP attack lions, this may be a benefit.

WeChat small program production method

WeChat small program production steps:

1.Download and install WeChat Developer Tools

WeChat Developer Tools is a special tool for WeChat small program development, you can download it for free from the official website, and follow the prompts to install it.

2. Create a small program project

In the WeChat developer tool, select “small program project”, fill in the project name, AppID and other basic information, select the path where the project is stored, you can create a new small program project. (If you want to do a small program, you can take a look at Rongshi Technology.)

3. Write code

WeChat’s small program is mainly developed in JavaScript, and needs to be used with WXML (WeChat small program page structure language) and WXSS (WeChat small program page style language) to complete the work of the page’s layout and style design. In WeChat Developer Tools, open the newly created project folder, find the “pages” folder, create your own pages in it, and use the above languages to complete the writing.

4. Debugging and Preview

After writing, you can select the “Preview” button in the WeChat developer tool to preview the page of your app, and you can also debug it to see how it works in different cell phones and different network environments.

5. Submit for review

After you finish writing, debugging and previewing, you can select the “Upload” button to submit your app to the WeChat app platform and fill in the basic information and review requirements. Then, wait for the WeChat small program official audit and release, you can officially online their own small program.

WeChat Developer Tools, Small Programs, how to use them?

Are you writing a small program through this? Or has someone else already written the code package for you and you just upload it? If you want to write small program code, the developer tool will automatically generate the framework, you just need to secondary development on top of this framework.

Open WeChat developer tools, you must be the administrator of the small program, in order to write code for the small program, scan the code to log in, enter the small program after selecting, after the developer tools will appear in the three need to fill in the box, the project directory, appid, project name, the directory to create a blank file can be appID is the appID of the app program, the name of the project is randomly fill in the best fill in the small program! It’s best to fill in the name of the applet so that you can tell the difference. After these get well, the developer tool will automatically generate the framework of the small program, you in the original framework for secondary programming, this is not much to say, the size of the grasp within 2M. If you are uploading the code package, this is the same as the above steps, the project directory, select your code package, click OK, and then preview, there is no problem, upload on the good, and then submit the small program background for review, and so on through the audit to submit the release of the code, the code if the developer to you to develop, he will give you a backstage, you only need to log in to the third-party backstage to add the module, edit the information can be.