【问题标题】:Webpack with React-Bootstrap, lots of 'Module Not Found' errors带有 React-Bootstrap 的 Webpack,许多“未找到模块”错误
【发布时间】:2015-10-05 01:43:14
【问题描述】:

我刚刚开始使用 Webpack,我无法找到打包 React-Bootstrap 的最佳方式。

尝试用 React 和 React-Router 打包 React-Bootstrap。 React 和 React-Router 都按预期工作,但 React-Bootstrap 出现错误。我查看了 Aliasing,使用供应商块,并像这样引用 React-Bootstrap:

import ReactBootstrap from 'react-bootstrap/dist/react-bootstrap';

但这似乎很笨拙。我正在寻找用 Webpack 打包 React-Bootstrap 的“正确”方式。

错误:

ERROR in ./~/react-bootstrap/lib/utils/childrenValueInputValidation.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/singlePropFrom' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib/utils
 @ ./~/react-bootstrap/lib/utils/childrenValueInputValidation.js 12:39-85

ERROR in ./~/react-bootstrap/lib/BootstrapMixin.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/keyOf' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/BootstrapMixin.js 15:30-67

ERROR in ./~/react-bootstrap/lib/ButtonGroup.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/all' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/ButtonGroup.js 21:28-63

ERROR in ./~/react-bootstrap/lib/Button.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/elementType' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/Button.js 21:36-79

ERROR in ./~/react-bootstrap/lib/Col.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/elementType' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/Col.js 23:36-79

ERROR in ./~/react-bootstrap/lib/Dropdown.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/all' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/Dropdown.js 61:28-63

ERROR in ./~/react-bootstrap/lib/Dropdown.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/elementType' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/Dropdown.js 65:36-79

ERROR in ./~/react-bootstrap/lib/Dropdown.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/isRequiredForA11y' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/Dropdown.js 69:42-91

ERROR in ./~/react-bootstrap/lib/Grid.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/elementType' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/Grid.js 17:36-79

ERROR in ./~/react-bootstrap/lib/Jumbotron.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/elementType' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/Jumbotron.js 17:36-79

ERROR in ./~/react-bootstrap/lib/MenuItem.js
Module not found: Error: Cannot resolve module 'react-prop-types/lib/all' in /Users/alex/Documents/lifter/node_modules/react-bootstrap/lib
 @ ./~/react-bootstrap/lib/MenuItem.js 19:28-63

我有什么遗漏吗?

编辑我已经试过了:

import { Something } from 'react-bootstrap';

它没有解决问题。

我还将添加我的 webpack 配置:

module.exports = {
    entry: './entry.jsx',
    output: {
        filename: 'bundle.js'
    },
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /(node_modules|bower_components)/,
                loader: 'babel-loader'
            }
        ]
    },
    resolve: {
        extensions: ['', '.js', '.jsx']
    }
}

【问题讨论】:

  • import { ComponentName } from 'react-bootstrap';
  • 这实际上是我尝试的第一件事。它没有改变输出。
  • 你是如何安装react-bootstrap的?

标签: reactjs webpack react-bootstrap


【解决方案1】:

react-bootstrap@0.26.0 was missing a dependency.

更新到 0.26.1 以修复它。

【讨论】:

    【解决方案2】:

    我可以修复它:

    $ npm install --force
    

    【讨论】:

      猜你喜欢
      • 2018-08-05
      • 2019-01-15
      • 2021-09-13
      • 2017-01-17
      • 2017-09-08
      • 2018-05-23
      • 2017-03-22
      • 2017-12-17
      • 2023-01-10
      相关资源
      最近更新 更多