Skip to content
This repository has been archived by the owner on Mar 11, 2024. It is now read-only.

TypeError: (0 , _drizzle.generateContractsInitialState) is not a function when trying to run freshly-unboxed Drizzle-box #24

Closed
DmitryPasenko opened this issue Mar 29, 2018 · 15 comments

Comments

@DmitryPasenko
Copy link

Hi! I'm new to web3 and truffle, but I've did everything as described in tutorial:

I have unboxed drizze-box
I have ganache-cli running on localhost:8545
I have deployed needed contracts successfully
ran webpack-server on localhost:3000
also my Metamask connected to localhost:8545 and shows a valid account from testrpc with right amount of ETH (99.675 ETH), considering small amount was spent when deploying those contracts.
Now, the webpage on localhost:3000 shows nothing and throws this error:
TypeError: (0 , _drizzle.generateContractsInitialState) is not a function

Any ideas what is wrong with that?

@sajclarke
Copy link

@DmitryPasenko the truffle box needs to be updated to latest version of drizzle so if you run npm update it will fix the issue. Make sure that you are also running metamask on localhost or else you'll get more errors

@DmitryPasenko
Copy link
Author

@sajclarke Thanks! It works now! )

@frostini
Copy link

frostini commented Apr 4, 2018

@sajclarke I was having the same issue and running the npm update seems to have fixed that issue; however, now I'm getting 'Erorr fetching network ID:' drizzle.js:8 followed by a 'Error: Returned error: TypeError: Failed to fetch' drizzle.js:8

@frostini
Copy link

frostini commented Apr 4, 2018

I just switched the network on MetaMask to localhost:8545 and now I'm getting 'Error initializing Drizzle:'

@frostini
Copy link

frostini commented Apr 4, 2018

I had to recompile and migrate the contracts again after I did the update :p working now !

@djudjuu
Copy link

djudjuu commented Apr 4, 2018

Just want to confirm, for me changing the versions of drizzle, drizzle-react, drizzle-react-components from 1.0.1 to 1.1.0 in the package.json fixed the error.

@chuckbergeron
Copy link
Contributor

Thanks @djudjuu ! I made your fix into a PR: #36

@davidrhodus
Copy link

ribbit. encountering this issue too. none of the above suggestions worked.

@shivamsinha15
Copy link

FYI After running npm update and re-running compile and migrate I get the following error

drizzle.js:3 Uncaught Error: Cannot find module "deepmerge"
at webpackMissingModule (drizzle.js:3)
at webpackUniversalModuleDefinition (drizzle.js:3)
at Object. (drizzle.js:10)
at webpack_require (bootstrap 40a2ec58107a3e3bc3b9:555)
at fn (bootstrap 40a2ec58107a3e3bc3b9:86)
at webpackUniversalModuleDefinition (drizzle-react.js:2)
at Object. (drizzle-react.js:10)
at Object. (drizzle-react.js:1955)
at webpack_require (bootstrap 40a2ec58107a3e3bc3b9:555)
at fn (bootstrap 40a2ec58107a3e3bc3b9:86)

After installing deepmerge npm i deepmerge I get the following error:

drizzle.js:3 Uncaught Error: Cannot find module "is-plain-object"
at webpackMissingModule (drizzle.js:3)
at webpackUniversalModuleDefinition (drizzle.js:3)
at Object. (drizzle.js:10)
at webpack_require (bootstrap 688f42e37c382c1b5fbb:555)
at fn (bootstrap 688f42e37c382c1b5fbb:86)
at webpackUniversalModuleDefinition (drizzle-react.js:2)
at Object. (drizzle-react.js:10)
at Object. (drizzle-react.js:1955)
at webpack_require (bootstrap 688f42e37c382c1b5fbb:555)
at fn (bootstrap 688f42e37c382c1b5fbb:86)

After installing npm i is-plain-object I get the orginal error:

Uncaught

TypeError: (0 , _drizzle.generateContractsInitialState) is not a function

@nickreynolds
Copy link

@shivamsinha15 that is exactly what I'm seeing too.

@shivamsinha15
Copy link

shivamsinha15 commented Jun 23, 2018

When you have a look at the actual drizzle repo package.json deepmerge and is-plain-object are dependencies

  "dependencies": {
    "deepmerge": "^2.1.0",
    "eth-block-tracker-es5": "^2.3.2",
    "is-plain-object": "^2.0.4",
    "redux": "^3.6.0",
    "redux-saga": "^0.15.3",
    "web3": "^1.0.0-beta.34"
  },

However when you check the webpack.config.js deepmerge and is-plain-object are external runtime dependencies:

  externals: {
    'eth-block-tracker': 'eth-block-tracker-es5',
    'redux': 'redux',
    'redux-saga': 'redux-saga',
    'web3': 'web3',
    'is-plain-object': 'is-plain-object',
    'deepmerge': 'deepmerge'
  } 

Therefore is it expected the boilerplate project created by truffle unbox drizzle should include these as dependencies in package.json ??. It seem to be missing from there. Could someone confirm if this in an oversight, if so I can submit a PR

package.json
{
  "name": "drizzle-box",
  "version": "1.0.0",
  "devDependencies": {
    "autoprefixer": "6.5.1",
    "babel-core": "6.17.0",
    "babel-eslint": "7.1.1",
    "babel-jest": "17.0.2",
    "babel-loader": "6.2.7",
    "babel-preset-react-app": "^2.0.1",
    "case-sensitive-paths-webpack-plugin": "1.1.4",
    "chalk": "1.1.3",
    "connect-history-api-fallback": "1.3.0",
    "cross-spawn": "4.0.2",
    "css-loader": "0.26.0",
    "detect-port": "1.0.1",
    "dotenv": "2.0.0",
    "drizzle": "^1.0.1",
    "drizzle-react": "^1.0.1",
    "drizzle-react-components": "^1.0.1",
    "eslint": "3.8.1",
    "eslint-config-react-app": "^0.5.0",
    "eslint-loader": "1.6.0",
    "eslint-plugin-flowtype": "2.21.0",
    "eslint-plugin-import": "2.0.1",
    "eslint-plugin-jsx-a11y": "2.2.3",
    "eslint-plugin-react": "6.4.1",
    "extract-text-webpack-plugin": "1.0.1",
    "file-loader": "0.9.0",
    "filesize": "3.3.0",
    "fs-extra": "0.30.0",
    "gzip-size": "3.0.0",
    "html-webpack-plugin": "2.24.0",
    "http-proxy-middleware": "0.17.2",
    "jest": "17.0.2",
    "json-loader": "0.5.4",
    "object-assign": "4.1.0",
    "openzeppelin-solidity": "^1.9.0",
    "path-exists": "2.1.0",
    "postcss-loader": "1.0.0",
    "promise": "7.1.1",
    "react-dev-utils": "^0.4.2",
    "recursive-readdir": "2.1.0",
    "strip-ansi": "3.0.1",
    "style-loader": "0.13.1",
    "truffle-contract": "^1.1.8",
    "truffle-hdwallet-provider": "0.0.3",
    "url-loader": "0.5.7",
    "webpack": "1.14.0",
    "webpack-dev-server": "1.16.2",
    "webpack-manifest-plugin": "1.1.0",
    "whatwg-fetch": "1.0.0"
  },
  "dependencies": {
    "eth-block-tracker-es5": "^2.3.2",
    "react": "^15.4.2",
    "react-dom": "^15.4.2",
    "react-redux": "^5.0.2",
    "react-router": "^3.0.2",
    "react-router-redux": "^4.0.7",
    "redux": "^3.6.0",
    "redux-auth-wrapper": "^1.0.0",
    "redux-saga": "^0.15.3",
    "redux-thunk": "^2.2.0",
    "web3": "1.0.0-beta.34"
  },
  "scripts": {
    "start": "node scripts/start.js",
    "build": "node scripts/build.js",
    "test": "node scripts/test.js --env=jsdom",
    "chain": "geth --datadir=\"/tmp/eth/60/01\" --nodiscover --maxpeers 0 --port 30301 --rpc --rpcapi \"db,eth,net,web3\" --rpcport 8101 --verbosity 6 console"
  },
  "jest": {
    "collectCoverageFrom": [
      "src/**/*.{js,jsx}"
    ],
    "setupFiles": [
      "<rootDir>\\config\\polyfills.js"
    ],
    "testPathIgnorePatterns": [
      "<rootDir>[/\\\\](build|docs|node_modules)[/\\\\]"
    ],
    "testEnvironment": "node",
    "testURL": "http://localhost",
    "transform": {
      "^.+\\.(js|jsx)$": "<rootDir>/node_modules/babel-jest",
      "^.+\\.css$": "<rootDir>\\config\\jest\\cssTransform.js",
      "^(?!.*\\.(js|jsx|css|json)$)": "<rootDir>\\config\\jest\\fileTransform.js"
    },
    "transformIgnorePatterns": [
      "[/\\\\]node_modules[/\\\\].+\\.(js|jsx)$"
    ],
    "moduleNameMapper": {
      "^react-native$": "react-native-web"
    }
  },
  "babel": {
    "presets": [
      "react-app"
    ]
  },
  "eslintConfig": {
    "extends": "react-app"
  }
}

This will atleast resolve the missing dependencies issue for deepmerge and is-plain-object.

@DiscRiskandBisque @asselstine However still not sure why I am seeing the following exceptions in the chrome console logs after installing these missing dependencies and starting drizzle:

TypeError: (0 , _drizzle.generateContractsInitialState) is not a function

@BryceMindLab
Copy link

@shivamsinha15 @nickreynolds

I have been trying to figure this problem out for hours and the answer is in this thread above, but I was missing one minor detail.

  1. Delete the drizzle module in the node_modulesdirectory
  2. Open up package.json and change "drizzle": "^1.0.1" to "drizzle: "1.1.5" (Make sure the caret (^) is not there!)
  3. npm install
  4. truffle compile
  5. truffle migrate
  6. npm run start

I left the caret before the version number and realized that in my drizzle module's package.json the version kept updating to 1.2.x.

@boazberman
Copy link

I'm needing the 1.2 feature of loading a contract dynamicaly, and running into similar errors. Has anyone found a solution in which I can use the 1.2 version with this box?

@svechinsky
Copy link

Resolved and submitted a PR.
trufflesuite/drizzle#95

@OnlyOneJMJQ
Copy link
Contributor

This should be fixed in Drizzle v1.2.2. @boazberman Regarding dynamic addition--it should be fixed as well, please open another issue if this still occurs after the update!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests