Компонент оболочки Carbon Design Systems React UI не работает

Question

Я пытаюсь использовать компонент Carbon Design UI Shell . Я следовал этому блогу , чтобы установить все библиотеки, зависимости и т. Д.

Ниже мой код:

import {UIShell} from 'carbon-components-react';
import React from 'react';
import logo from './logo.svg';
import './App.css';



function App() {
return (
<div className="App">
  <header className="App-header">
    <img src={logo} className="App-logo" alt="logo" />
    <p>
      Edit <code>src/App.js</code> and save to reload.
    </p>
    <a
      className="App-link"
      href="https://reactjs.org"
      target="_blank"
      rel="noopener noreferrer"
    >
      Learn React
    </a>
    <UIShell>UIShell Placeholder</UIShell>

  </header>
 </div>
 );
 }

 export default App;

Когда я запускаю этот код, я получаю:

 "Failed to compile: ./src/App.js Attempted import error: 'UIShell' is not exported from 'carbon-components-react'."

Согласно хранилищу , UIShell является компонентом углерод-компоненты-реагируют . Почему я получаю эту ошибку?

Answer 1

Если вы посмотрите на ./node_modules/carbon-components-react/lib/index.js, вы увидите, что, хотя UIShell определено в .../lib/components/, оно не экспортируется.

Таким образом, вопрос на самом деле ... как мы можем получить доступ к компонентам UIShell из библиотеки компонентов carbon-components-react, когда она не экспортируется?

Я обнаружил, что можно явно импортировать библиотеку компонентов UIShell:

import {...} from 'carbon-components-react/es/components/UIShell'

Или, если вы не используете ESM, я думаю, что вы могли бы require компоненты с помощью следующего:

require('carbon-components-react/lib/components/UIShell')