Docz: Object(...) is not a function

Created on 15 Aug 2018 · 16Comments · Source: doczjs/docz

Bug Report

After update from 0.8.0 to 0.9.0 and still present in the latest 0.11.0

Open localhost and get the trace on the screen

Stack trace
in BrowserRouter (created by DoczTheme)
in DataServer (created by DoczTheme)
in CopyOnWriteStoreProvider (created by DoczTheme)
in ErrorBoundary (created by DoczTheme)
in DoczTheme (at root.jsx:7)
in Root (created by HotExportedRoot)
in AppContainer (created by HotExportedRoot)
in HotExportedRoot (at index.jsx:17)

The trace in the console

BrowserRouter.js?a051:29 Uncaught TypeError: Object(...) is not a function
    at new BrowserRouter (BrowserRouter.js?a051:29)
    at new BrowserRouter (eval at <anonymous> (react-hot-loader.development.js?0a98:1761), <anonymous>:5:7)
    at constructClassInstance (react-dom.development.js?61bb:11448)
    at updateClassComponent (react-dom.development.js?61bb:13145)
    at beginWork (react-dom.development.js?61bb:13825)
    at performUnitOfWork (react-dom.development.js?61bb:15864)
    at workLoop (react-dom.development.js?61bb:15903)
    at HTMLUnknownElement.callCallback (react-dom.development.js?61bb:100)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?61bb:138)
    at invokeGuardedCallback (react-dom.development.js?61bb:187)

doczrc.js

export default {
  src: './app',
};

Readme.mdx

# Hello

bug

Source

denisborovikov

👍7

All 16 comments

I'm experiencing a similar error but only when running the production build (e.g., from docz build). My thinking is it is from babel 7 plugin versions getting mismatched. Maybe it will stabilize when babel 7 gets officially released? That's what I'm 🙏ing for.

rawrmonstar on 22 Aug 2018

I am getting this error as well on production build :(

zicodeng on 22 Aug 2018

Just an update, deleting my package-lock.json and npm installing fixes my production build issue now. I figure the dependencies work together again 😄

rawrmonstar on 25 Aug 2018

👍1

Didn't work for me.

denisborovikov on 25 Aug 2018

@denisborovikov could you please remove .docz and rerun docz build? After answer if the solution worked

nicholasess on 25 Aug 2018

Remove .docz and rebuilt the docs worked for me :)

zicodeng on 26 Aug 2018

@nicholasess Tried to wipe node_modules and reinstalled completely, removed .docz and none of it helped in my case. The error rises in dev mode not in production as others mentioned before. Seems some kind of modules incompatibility.

denisborovikov on 27 Aug 2018

At last, I've found that in my case the problem was in outdated history package. We used 3.0.0 and upgrade to the latest 4.7.2 resolved the issue.

Feel free to close the ticket as I can see all the others already resolved it before.

denisborovikov on 6 Sep 2018

Using version @0.13.5:

package.json:

{
  "devDependencies": {
    "@babel/cli": "^7.0.0",
    "@babel/core": "^7.0.0",
    "@babel/node": "^7.0.0",
    "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
    "@babel/plugin-transform-exponentiation-operator": "^7.0.0",
    "@babel/polyfill": "^7.0.0",
    "@babel/preset-env": "^7.0.0",
    "@babel/preset-react": "^7.0.0",
    "@babel/register": "^7.0.0",
    "babel-core": "^7.0.0-bridge.0",
    "babel-eslint": "^10.0.1",
    "babel-jest": "^23.4.2",
    "babel-loader": "^8.0.0",
    "babel-plugin-dynamic-import-node": "^2.0.0",
    "cross-env": "^5.2.0",
    "cypress": "^3.1.3",
    "dotenv": "^6.1.0",
    "enzyme": "^3.7.0",
    "enzyme-adapter-react-16": "^1.7.0",
    "enzyme-to-json": "^3.3.5",
    "eslint": "^5.3.0",
    "eslint-config-airbnb": "^17.0.0",
    "eslint-plugin-cypress": "^2.0.1",
    "eslint-plugin-import": "^2.13.0",
    "eslint-plugin-jsx-a11y": "^6.1.1",
    "eslint-plugin-react": "^7.10.0",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "font-awesome": "^4.7.0",
    "husky": "^1.2.0",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^23.6.0",
    "jsdom": "^13.0.0",
    "lint-staged": "^8.1.0",
    "react-test-renderer": "^16.6.3",
    "redux-mock-store": "^1.5.3",
    "uglifyjs-webpack-plugin": "^2.0.1",
    "webpack-cli": "^3.1.2",
    "webpack-dev-middleware": "^3.4.0",
    "webpack-dev-server": "^3.1.10",
    "webpack-hot-middleware": "^2.24.3",
    "why-did-you-update": "^1.0.6"
  },
  "dependencies": {
    "async": "^2.6.1",
    "autoprefixer": "^9.4.2",
    "axios": "^0.18.0",
    "chain-function": "^1.0.1",
    "chart.js": "^2.7.3",
    "classnames": "^2.2.6",
    "compression": "^1.7.3",
    "cookie-parser": "^1.4.3",
    "cross-env": "^5.2.0",
    "css-loader": "^1.0.1",
    **"docz": "^0.13.5",
    "docz-plugin-css": "^0.11.0",
    "docz-theme-default": "^0.13.5",**
    "es6-promise": "^4.2.5",
    "express": "^4.16.4",
    "file-loader": "^2.0.0",
    "google-maps": "^3.3.0",
    **"history": "^3.3.0",**
    "html2canvas": "^1.0.0-alpha.12",
    "jquery": "^3.3.1",
    "js-cookie": "^2.2.0",
    "json-loader": "^0.5.7",
    "lodash": "^4.17.11",
    "moment": "^2.22.2",
    "node-sass": "^4.10.0",
    "normalizr": "^3.3.0",
    "oboe": "^2.1.4",
    "parse-link-header": "^1.0.1",
    "postcss-load-config": "^2.0.0",
    "postcss-loader": "^3.0.0",
    "prop-types": "^15.6.2",
    "pubsub-js": "^1.7.0",
    "radium": "^0.25.0",
    **"react": "^16.6.3",**
    "react-animate-on-scroll": "^2.1.5",
    "react-chartjs-2": "^2.7.4",
    "react-custom-scrollbars": "^4.2.1",
    "react-dom": "^16.6.3",
    "react-ga": "^2.5.6",
    "react-hot-loader": "^4.3.12",
    "react-input-mask": "^2.0.4",
    "react-notification-system": "^0.2.17",
    "react-reconciler": "^0.17.2",
    "react-redux": "^5.1.1",
    **"react-router": "^3.2.0",**
    "react-slick": "^0.23.2",
    "react-sortable-hoc": "^0.8.4",
    "react-tippy": "^1.2.3",
    "react-transition-group": "^2.5.0",
    "react-typist": "^2.0.4",
    "redux": "^3.7.2",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.3.0",
    "sass-loader": "^7.1.0",
    "socket.io-client": "^2.2.0",
    "style-loader": "^0.23.1",
    "url-loader": "^1.1.2",
    "url-template": "^2.0.8",
    "uuid": "^3.3.2",
    "velocity-animate": "^1.5.2",
    "webpack": "^4.27.0"
  }
}

mateusmoura on 21 Dec 2018

👍1

Try to remove libs from package.json one by one. That's how I found the problem last time.

Now I get the same error when use react alpha (the one with hooks). I think the error message doesn't point to problems with a specific library and it can be any of it.

denisborovikov on 23 Dec 2018

@denisborovikov did you resolve the above error with hooks? (I'm running into it now - not sure if docz is meant to be compatible)

alidlorenzo on 29 Dec 2018

@alidcastano yes, after each modules update (yarn or npm command), delete node_modules/docz-core/node_modules/react and docz will use your alpha with hooks.

denisborovikov on 30 Dec 2018

I found something strange; i'm getting this exact error but just because in my component i'm importing a method that lives in folder called utils (indide src folder). Does anyone knows why this behavior? Thanks!

Emiliano-Bucci on 26 Jan 2019

I'm receiving the same error - the location is in the emotion cache.
var EmotionCacheContext = Object(react__WEBPACK_IMPORTED_MODULE_0__["createContext"])(Object(_emotion_cache__WEBPACK_IMPORTED_MODULE_1__["default"])());

Does this have to do with the emotion module? Or is it according to @denisborovikov advice to remove modules one by one to figure out the solution?

EDIT: This seems like an emotion issue that's still open https://github.com/emotion-js/emotion/issues/1185

EDIT 2: Updating React to 16.3.3 fixed it - using React v15 doesn't have the Context API which seems to be necessary in docz

mistermjtek on 29 Jan 2019

I also encountered this problem, I tried to remove the dependencies in package.json by dichotomy, and finally moved out of "bisheng"(markdown generator) and it work, indicating that this problem is probably caused by dependencies.

GFwer on 12 Mar 2019

Just an update, deleting my package-lock.json and npm installing fixes my production build issue now. I figure the dependencies work together again 😄

Thanks you, the problem is solved!