response-bootstrap bsClass неправильно устанавливается при сборке в рабочем режиме - PullRequest
0 голосов
/ 19 февраля 2019

У меня проблема с неправильным отображением выпадающих меню после создания реакции-начальной загрузки в производственном режиме:

enter image description here

При ближайшем рассмотрениипохоже, что HTML загружается с неправильным классом: <ul role="menu" class="super-colors -menu" aria-labelledby="dropdown-custom-1">.В этом случае класс должен быть dropdown-menu, а не -menu.

Когда я проверяю элементы реквизита, похоже, что это вызвано неправильной установкой bsClass:

{
  "className": "super-colors",
  "bsRole": "menu",
  "pullRight": false,
  "bsClass": "-menu",
  "open": false,
  "labelledBy": "dropdown-custom-1",
  "onClose": "[function bound ]",
  "onSelect": "[function ]",
  "rootCloseEvent": "mousedown"
}

Для справки, вот код для элемента, показанного выше:

<ButtonToolbar>
  <Dropdown
    id="dropdown-custom-1"
    onToggle={() => console.log('hi')}
    rootCloseEvent="mousedown"
  >
    <Dropdown.Toggle>Pow! Zoom!</Dropdown.Toggle>
    <Dropdown.Menu className="super-colors">
      <MenuItem eventKey="1">Action</MenuItem>
      <MenuItem eventKey="2">Another action</MenuItem>
      <MenuItem eventKey="3" active>
        Active Item
      </MenuItem>
      <MenuItem divider />
      <MenuItem eventKey="4">Separated link</MenuItem>
    </Dropdown.Menu>
  </Dropdown>
</ButtonToolbar>

Некоторая другая (возможно) релевантная информация:

  • Мы используем библиотеку пользовательского интерфейса, называемую patternfly-react, который построен на основеact-bootstrap, но проблема, похоже, в реакции-bootstrap.
  • Приложение использует response-bootstrap 0.32.1
  • Отображается, только когда приложениевстроен в производственный режим, режим разработки работает нормально.
  • У нас есть довольно нестандартная установка, в которой мы запускаем React внутри приложения Angular 6.

Кто-нибудь знает, чтоможет быть, это произойдет?

1 Ответ

0 голосов
/ 19 февраля 2019

Итак, это оказалось проблемой с Angular.Отключение оптимизации сборки в angular.json устранило проблему.

"production": {
  ...
  "vendorChunk": false,
  "buildOptimizer": false,

Оптимизатор сборки уменьшает размер скомпилированного пакета, поэтому, хотя это решение работает, оно не обходится без недостатков.

...