Я изучаю React. Я пытаюсь добавить компонент реакции FORM из https://github.com/rjsf-team/react-jsonschema-form?fbclid=IwAR0HdGosg659-F0hdFp-milh29G_6UX5_qbti6lZBmo7OYKIxgThD5f1Ff8 в свое фиктивное приложение. Я использовал документацию по форме схемы response json https://react-jsonschema-form.readthedocs.io/en/latest/#installation.
У меня красный Использование компонента React из js исходных карт и react-jsonschema -form Как использовать его через cdn? , который может решать аналогичную проблему. Однако я все еще много борюсь.
Я сделал:
npx create-react-app my-app
cd my-app
, npm install
Моя версия реакции "реагировать": "^ 16.13.1", "react-dom": "^ 16.13.1", "react-scripts": "3.4.1"
npm install @rjsf/core --save
Мое фиктивное приложение. js компонент:
import React from 'react';
import Form from "@rjsf/core";
function App() {
const Form = JSONSchemaForm.default;
const schema = {
type: "string"
};
return (
<div className="App">
<Form schema={schema} />
</div>
);
}
export default App;
Я нажимаю npm start и получаю сообщение об ошибке:
./src/App.js
Line 6:16: 'JSONSchemaForm' is not defined no-undef
Насколько я понимаю, webpack не может найти модуль JSONSchemaForm (?) Я попытался добавить файл cdn из документации в индекс . html.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<script src="https://unpkg.com/@rjsf/core/dist/react-jsonschema-form.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1" />
Не помогло. В документации сказано, что я должен добавить исходную карту. Однако я не знаком с исходными картами. Я написал определение в mozilla MDN, но не знаю, как его реализовать. Я также не знаком с ручной настройкой конфигураций веб-пакетов и не требую. js упоминается в этом решении response-jsonschema-form Как использовать его через cdn? .
Вопрос - как вероятно ли, что добавление исходной карты решит проблему? Вам нужно изучить webpack? Видите ли вы другие причины, по которым я не могу отобразить компонент формы?
Если добавление исходной карты, вероятно, решит проблему, какие свойства веб-пакета необходимо знать в этом случае?