responsestrap 7.1 с Reaction-Popper 0.10.4 производит TypeError - PullRequest
0 голосов
/ 19 января 2019

Я пытаюсь определить шаблонный проект, который включает Webpack 4, Babel 7, React 16.7, Bootstrap 4.2 и Reactstrap 7.1.

Хотя отображаемая страница отображается, как и ожидалось, после npm start Я вижу эту ошибку в своей консоли:

popper.js:340 Uncaught TypeError: Cannot use 'in' operator to search for 'default' in undefined
    at popper.js:340
    at reactstrap.full.min.js:1
    at reactstrap.full.min.js:1

Вот мои основные настройки:

package.json

  "devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/preset-env": "^7.2.3",
    "@babel/preset-react": "^7.0.0",
    "acorn": "^6.0.5",
    "acorn-jsx": "^5.0.1",
    "babel-eslint": "^10.0.1",
    "babel-loader": "^8.0.5",
    "eslint": "^5.12.0",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-loader": "^2.1.1",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-jsx-a11y": "^6.1.2",
    "eslint-plugin-react": "^7.12.4",
    "react-hot-loader": "^4.6.3",
    "webpack": "^4.28.4",
    "webpack-cli": "^3.2.1",
    "webpack-dev-server": "^3.1.14"
  },
  "dependencies": {
    "autoprefixer": "^9.4.5",
    "bootstrap": "^4.2.1",
    "css-loader": "^2.1.0",
    "jquery": "^3.3.1",
    "postcss-loader": "^3.0.0",
    "precss": "^4.0.0",
    "prop-types": "^15.6.2",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "reactstrap": "^7.1.0",
    "sass-loader": "^7.1.0",
    "style-loader": "^0.23.1"
  }

dist/index.html

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>The Minimal React Webpack Babel Setup</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/reactstrap/7.1.0/reactstrap.full.min.js"></script>
  </head>
  <body>
    <div id="app"></div>
    <script src="./bundle.js"></script>
  </body>
</html>

src/index.js

/* eslint-disable */
import React from 'react';
import ReactDOM from 'react-dom';
import 'bootstrap/dist/css/bootstrap.css';
import { Jumbotron, Button } from 'reactstrap';

const title = 'My Minimal React Webpack Babel Setup';

const indexPage = (
  <Jumbotron>
    <h1>Hello, world!</h1>
    <p>
      This is a simple hero unit, a simple jumbotron-style component for calling
      extra attention to featured content or information.
    </p>
    <p>
      <Button>Learn more</Button>
    </p>
  </Jumbotron>
);

ReactDOM.render(
  indexPage,
  document.getElementById('app'),
);

module.hot.accept();

$ npm ls реагирует-поппер

minimal-react-boilerplate@1.0.0 /Users/francoisvanderhoven/learn/webpack/minimal-react-boilerplate
└─┬ reactstrap@7.1.0
  └── react-popper@0.10.4 

Может кто-нибудь поделиться со мной успешной конфигурацией библиотек, которые я хотел бы объединить?

...