React Select IE 11 - TypeError: объект не поддерживает свойство или метод 'assign' - PullRequest
Новая
       25

React Select IE 11 - TypeError: объект не поддерживает свойство или метод 'assign'

1 голос
/ 02 мая 2019

Что не так с этим кодом ... IE 11 выкидывает TypeError: Object не поддерживает свойство или метод 'assign' ... chrome работает нормально 

import React from 'react';

import Select,{components} from 'react-select';
import { colourOptions } from '../react-select_Samples/data.js';

const Option = props => { 
    return ( <div>
        <components.Option {...props}><input type="checkbox" checked={props.isSelected} onChange={() => null} />{props.label}
        </components.Option></div> ); 
    };
export class SampleDropdown extends React.Component {
    render() {       
        return (
            <Select
              className="basic-single"
              classNamePrefix="select"
              defaultValue={colourOptions[4]}
              isSearchable
              name="color"
              options={colourOptions}
              components={{ Option}}              
              hideSelectedOptions={false}
              isMulti
            />
        );
    }
}

вот package.json ... у него есть следующие пакеты "Самозагрузка (^ 3.4.1), es6-обещание-обещание (^ 1.0.0), реакция (^ 16.8.6), реакция-бутстрап (^ 0.31.5), реакция-дом (^ 16.8.6), реакция -router-bootstrap (^ 0.25.0), response-router-dom (^ 5.0.0), response-сценарии (3.0.0), response-select (^ 2.4.3), rimraf (^ 2.6.3), WHATWG-выборки (^ 3.0.0" 

{
  "name": "reports_react",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "bootstrap": "^3.4.1",
    "es6-promise-promise": "^1.0.0",
    "react": "^16.8.6",
    "react-bootstrap": "^0.31.5",
    "react-dom": "^16.8.6",
    "react-router-bootstrap": "^0.25.0",
    "react-router-dom": "^5.0.0",
    "react-scripts": "3.0.0",
    "react-select": "^2.4.3",
    "rimraf": "^2.6.3",
    "whatwg-fetch": "^3.0.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

1 Ответ

0 голосов
/ 02 мая 2019

При сборке приложения React (dev или prod) операции распространения преобразуются в Object.assign назначения.

Решением было бы использование пакета babel-polyfill и импорт прямо в верхней части вашей точки входа (index.js по умолчанию) для обеспечения правильной функциональности.

Другое решениедля извлечения вашего приложения реакции, используя yarn eject, что позволит вам настроить процедуру сборки вашего приложения.Возможно, вам придется удалить папку node_modules и переустановить ваши пакеты.

После извлечения вам придется установить пакет @babel/plugin-transform-object-assign, используя yarn add @babel/plugin-transform-object-assign --dev и добавить следующее к вашему package.json под атрибутом babel: 

{
    ...
    "babel": {
        "presets": ["react-app"],
        "plugins": ["@babel/plugin-transform-object-assign"]
    }
    ...
}

или следующее для любого babel файла конфигурации: 

{
    "presets": ["react-app"],
    "plugins": ["@babel/plugin-transform-object-assign"]
}

Это преобразует все Object.assign, поэтому они могут использоваться в неподдерживаемых средах (например, IE11).

Для этого метода необходимо извлечь, так как в Facebook есть конфигурации для встроенного create-react-app для обеспечения функций по умолчанию.

...