Cannot find module './factoryWithThrowingShims' about mdb-react-ui-kit HOT 8 CLOSED

Have You installed 'react-responsive' in Your project?
In some cases this dependency is causing similiar problems.

from mdb-react-ui-kit.

No

My complete list is as follows

  "dependencies": {
    "es6-promise": "^4.2.4",
    "isomorphic-fetch": "^2.2.1",
    "mdbreact": "git+https://github.com/mdbootstrap/React-Bootstrap-with-Material-Design.git",
    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "reflux": "^6.4.1"
  },
  "devDependencies": {
    "babel-plugin-transform-object-rest-spread": "^6.26.0",
    "babel-preset-env": "^1.6.1",
    "babel-preset-react": "^6.24.1",
    "babelify": "^7.3.0",
    "browserify": "^14.5.0",
    "copyfiles": "^1.2.0",
    "envify": "^4.1.0",
    "eslint": "^4.16.0",
    "eslint-plugin-react": "^7.7.0",
    "express": "^4.16.2",
    "node-sass": "^4.7.2",
    "nodemon": "^1.14.11",
    "parallelshell": "^2.0.0",
    "uglify-es": "^3.3.9",
    "uglifyify": "^4.0.5",
    "watch": "^1.0.2"
  }

from mdb-react-ui-kit.

Can You add new devDependency called 'prop-types' (https://www.npmjs.com/package/prop-types)?
There is a chance that it wil fix Your issue. If not, we'll try to find another solution.

from mdb-react-ui-kit.

no luck, unfortunately

$ npm install prop-types --save-dev

+ [email protected]
updated 1 package in 9.505s
$ npm run build:js

> [email protected] build:js /Users/...
> browserify index.js -t [ babelify --presets [ env react ] ] -o build/web-bundle.js

Error: Cannot find module './factoryWithThrowingShims' from '/Users/.../node_modules/mdbreact/dist'

from mdb-react-ui-kit.

I have no experience with webpack, but can the error be between webpack and browserify?

I use browserify in my project, but mdbreact uses webpack

I can run the downloaded files just fine, but due to my complete lack of knowledge when it comes to webpack, I am hesitant as to move to my project to webpack, even though this could possibly be a workaround to the issues

I have tried editing the dist/mdbreact.js - but this just results in brand new errors that I didn't see coming, and it seems to be quite counterintuitive to have to edit stuff in the node_modules folder

from mdb-react-ui-kit.

It is very likely that browserify is not compatible with webpack settings and that is causing problems. In the standard configured project (based on webpack) such error does not appear.

from mdb-react-ui-kit.

I ran across this post while doing some digging for a similar issue on a different project and I think I might know what's going on.

mdbreact uses 'prop-types' but the library isn't listed in the packages.json. If you look at the compiled mdbreact.js in dist, you'll notice an interesting piece of code compiled by webpack:

if (true) {
  ...
  // By explicitly using `prop-types` you are opting into new development behavior.
  // http://fb.me/prop-types-in-prod
  var throwOnDirectAccess = true;
  module.exports = __webpack_require__(57)(isValidElement, throwOnDirectAccess);
} else {
  // By explicitly using `prop-types` you are opting into new production behavior.
  // http://fb.me/prop-types-in-prod
  module.exports = require('./factoryWithThrowingShims')();
}

When dealing with externals, they should be added to the webpack config. I found a similar issue here.

If you add the following to the externals in mdbreact's webpack config, it should fix the issue.

"prop-types": {
    root: 'PropTypes',
    commonjs2: 'prop-types',
    commonjs: 'prop-types',
    amd: 'prop-types',
}

from mdb-react-ui-kit.

Fixed

from mdb-react-ui-kit.