Global Settings

design to code global settings


In the bottom right corner of the plugin, click the settings button.

Configuration items

You can set transcoding and picture-related configurations on the configuration page.
configuration itemdescriptioninterface
Transcoding ModeOptional transcoding mode. After tailwind is enabled, you will not be able to preview it, you can copy the code to the project to view the effect'jsx+scss' | 'jsx+tailwind'
Copy code modefile contains components and references, template contains only template code'file' | 'template'
Show copy JSON buttonWhether to show copy JSON button on transcoding pageboolean
Image InterfaceWhen customizing the image upload interface, select custom'default' | 'custom'
Image Interface configurationWhen customizing the image upload interface, you can pass the authentication token of the layer through the custom header or custom bodyImageUploadConfig


Custom image interface

The image upload interface is used to upload images, js, css, and json files during transcoding. The files uploaded by the default interface of the community version plug-in will only be saved for 3 hours. If you need to store them for a longer period of time, you need to customize the image upload service.


You can choose the following methods for authentication, which will be transparently transmitted to the interface you requested after configuration:
  • query: directly splicing the authentication token into the URL
  • header: pass the authentication token through the header
  • body: pass the authentication token through the body

Interface return

The interface return value needs to contain the url of the picture, and the types are as follows.


Below is an example of passing token in body.
  • Note that the request body is encoded by multipart/form-data, so you need a corresponding library to parse the request body. In the example below, we use the koa-body library.
  • When processing files, please note that the key of the file is 'file'. Other fields of the request body are customized by you.

© 2021 - 2023 Semi Design. All rights reserved.

京ICP备19058139号-13浙公网安备 33011002016131号

Designed & Developed with love by Douyin FE & MED

  • Start
    • Introduction
    • Quick Start
    • Comparisons
    • Terms
    • FAQ
    • Changelog
  • Design to Code
    • Code Translation
    • Mark Layer
    • Mark Table
    • Mark Component Library
    • Mark Icon Library
    • Inspect
    • Transform plugin
    • Troubleshooting
    • Basic D2C logic
    • Supported Components
    • Global Settings
  • UI Kit
    • Import UI Kit
    • Create Variants
    • Design draft rules
    • Table Usage
    • Form Usage
    • Variant Update Notes
  • About
    • Contact Us
    • Road map
    • JSON Schema
    • Known issues