@iceland/intelligent-code

Intelligent Code

将 json 转化为代码，使用方式参考 test.

Usage

Source Data(see /lib/interfaces.d.ts):

const sourceData = {
    id: 'div-1',
    type: 'div',
    children: [
        {
            id: 'spn-1',
            type: 'span',
            children: '你的名字：'
        },
        {
            id: 'Input-2',
            type: 'Input',
            npmName: '@icedesign/base',
            props: {
                style: {
                    fontSize: 28,
                    fontWeight: 'bold'
                },
                value: '阿里巴巴'
            }
        }
    ]
};

Use intelligent-code:

const intelligentCode = require('@ali/iceland-intelligent-code');
const result = intelligentCode(sourceData);

/*
{
  codeFileTree: {
    'index.jsx': ``,
    'stores': {},
    'actions': {}
  },
  entryFileName: 'index.jsx'
  deps: []
}
*/

The expected output:

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { Input } from '@icedesign/base';

class div1 extends Component {

    render() {
        return (
            <div>
                <span>
                    你的名字：
                </span>
                <Input style={styles.yourNameInput} value="阿里巴巴" />
            </div>
        );
    }
}

const styles = {
    "yourNameInput": {
        "fontSize": 28,
        "fontWeight": "bold"
    }
};


ReactDOM.render(<div1 />, mountNode);