Ошибка Adjacent JSX elements must be wrapped in an enclosing tag. Did you want a JSX fragment

Syntax Error: SyntaxError: Adjacent JSX elements must be wrapped
 in an enclosing tag. Did you want a JSX fragment <>...</>?

Рабочим оказывается вариант вроде:


function Welcome(props) {
  return   (
   <React.Fragment>

        <div className="uk-vertical-align uk-text-center uk-height-1-1">
            <div className="uk-vertical-align-middle" style={{width: "250px"}}>

                <img className="uk-margin-bottom" width="140" height="120" src="" alt=""/>
                <form className="uk-panel uk-panel-box uk-form">
                    <div className="uk-form-row">
                        <input className="uk-width-1-1 uk-form-large" type="text" placeholder="Username"/>
                    </div>
                    <div className="uk-form-row">
                        <input className="uk-width-1-1 uk-form-large" type="text" placeholder="Password"/>
    
                    </div>
                    <div className="uk-form-row">
                        <a className="uk-width-1-1 uk-button uk-button-primary uk-button-large" href="#">Login</a>
                    </div>
                    <div className="uk-form-row uk-text-small">
                        <label className="uk-float-left"><input type="checkbox"/> Remember Me</label>
                        <a className="uk-float-right uk-link uk-link-muted" href="#">Forgot Password?</a>
                    </div>
                </form>

            </div>
        </div>
        <h1>Привеееет, {props.name}</h1>
     </React.Fragment>
    );
}

const element = <Welcome name="React.js! ✅" />;
ReactDOM.render(
  element,
  document.getElementById('hello')
);

-- если возвращаем несколько html-элементов, их нужно обернуть в React.Fragment, обратите внимание, что если вы начинаете прописывать html с новой строки после return, то будут нужны скобки.

Key Words for FKN + antitotal forum (CS VSU):