Preface
Flutter is Google's open source cross-platform UI framework, which has become the first choice of more and more developers due to its advantages in "multi-terminal consistency" and "rendering performance". However, as the scale of use increases, in order to solve many rapidly iterative business product lines and needs, dynamics has become an urgent problem to be solved.
Fair is a dynamic framework self-developed by 58. Through the automatic conversion of native Dart source files by the Fair Compiler tool, the project has the ability to dynamically update Widget Tree and State.
Recently, after absorbing the feedback and suggestions from the open source community, we have improved the construction of Fair's supporting tools for the development experience. Let's get to the topic.
Project Background
The Fair supporting tool chain is developed to help developers quickly get started with Fair development, improve Fair development efficiency, and avoid the Flutter syntax that Fair does not support. It mainly includes three parts:
- Create Project：Quick create Fair dynamic/carrier project
- Template Code：Provide Page/Project template code
- Local Hot Update Service：Offline development and use, realize the rapid preview of Fair dynamic function in the development stage
We provide it to developers in the form of dart command line tools and AS plugin.
Flowchart
The use flow chart is as follows:
Instructions for use
Step 1: Tool Installation
Install the Faircli command line tool
dart pub global activate faircli
Install AS plugin
The plugin marketplace is now uploaded. Install it by searching for "FairTemplate" from /Android Studio/Preference/Plugins.
After the preparations are completed, enter the development and use process below.
Step 2: Faircli-Project Creation
Engineering is divided into carrier engineering and dynamic engineering. Dynamic function modules need to be developed in dynamic engineering. The carrier project provides bundle download, loading and basic capability support.
Create dynamic project
faircli create -n dynamic_project_name
dynamic_project_name: dynamic project name
Create vector project
faircli create -k carrier -n carrier_project_name
carrier_project_name: carrier project name
Step 3: IDE Plugin - Function Development
Template code usage
Select a code template to generate the corresponding code file.
In the generated code, secondary development is performed.
One-click packaging
After the function development is completed, the AS plugin can be used for one-click packaging.
Step 4: Start the local hot update service
After the packaging is complete, you can start the local hot update service to preview the development functions.
When the console prints the following information, it means that the local hot update service is successfully started.
developer option
Run the vector project and go to the developer options page.
Enter host to load the bundle list. Select the corresponding bundle for function preview.
Shake the phone to trigger the reload function.
Step 5: IDE Plugin - Upload the bundle to the online environment
Effect
After using the faircli tool to configure the local hot update service, open the developer options on the mobile device, select the local mode, enter the computer ip address, and you can happily preview the fair dynamic effect.
Summary and Outlook
This article mainly introduces the use of Fair's supporting tool chain. The supporting tools solve the current pain points in the use of Fair. In the future, we will continue to pay attention to your feedback and suggestions in the open source community.
Support us
Everyone is welcome to use Fair, and everyone is welcome to light up the stars for us
Github address: https://github.com/wuba/fair
Fair official website: https://fair.58.com/
Contributions welcome
Submit issues through Issue, please submit a Pull Request to contribute code, and the administrator will update the code review.
Top comments (0)