lidaof / eg-react

WashU Epigenome Browser
https://epigenomegateway.wustl.edu
Other
68 stars 30 forks source link

npm run setup error #109

Closed LongZhao1992 closed 4 years ago

LongZhao1992 commented 5 years ago

Hi @lidaof I want to build a custom genome using Washu just like https://epigenomegateway.readthedocs.io/en/latest/installation.html mentioned. However, when I Run "npm run setup", I got an error "events.js:167 throw er; // Unhandled 'error' event". image I tried to google for help, but did not get any resolutions, including "npm updat","killall node","echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p", etc. My node version is v10.9.0, npm version is 6.2.0; MongoDB is 4.0.9. And disk space may also be enough. image

Thanks in advance, Long Zhao

lidaof commented 5 years ago

Hi @LongZhao1992 , can you check is the format of your files same as ours https://github.com/lidaof/eg-react/tree/master/backend/genomeData/mm10? if you use our files, it works, then likely your format is not right.

LongZhao1992 commented 5 years ago

@lidaof Thank you so much for your reply. Yes, it is. Everything was done under eg-react/backend folder, and the genome files were the mm10 folder you provide. I just wonder is there anything wrong with MongoDB, and how could I check this problem?

Regards

lidaof commented 5 years ago

Hi @LongZhao1992 , i see, we haven't try the new mongodb yet. I will do some test based on MongoDB 4.x version.

LongZhao1992 commented 5 years ago

Hi @lidaof, Are there any versions of MongoDB recommend? Thank you very much. :)

lidaof commented 5 years ago

Hi @LongZhao1992 we have tested 3.4 and 3.6 both should work.

LongZhao1992 commented 5 years ago

OK,I will try it. I appreciate your time. Your reply is really helpful for me. All the best.

lidaof commented 5 years ago

You are very welcome @LongZhao1992 . If I found something related to v4.x of mongodb I will let you know.

LongZhao1992 commented 5 years ago

Hi @lidaof, I downloaded a 3.6 version MongoDB, but I got the same error. When I typed "npm install" in backend folder, I got the WARN like the figure. image --force doesn't work. I tried to install hapi using npm, but nothing was changed. May I get some advances from you?

Best.

lidaof commented 5 years ago

Hi @LongZhao1992 I actually never see this error. is it possible you can try use nodejs v8.x ?

LongZhao1992 commented 5 years ago

Hi @lidaof , Thank you, this issue may due to the version, and I solved it now. Unfortunately, I get another issue just like #101, but I do not quite understand the problems you talked about. image I modified src/dataSources/GeneSource.js , backend/main.js and backend/package.json image image image

But it doesn't work.

lidaof commented 5 years ago

Hi @LongZhao1992 , so you switched to nodejs v8.x and it works?

can you just change the AWS_API line to export const AWS_API = ""? (make it an empty string since you are using your own backend API)

LongZhao1992 commented 5 years ago

Hi @lidaof , yes, it works with nodejs v8.16. But I got a data fetch error when using the browser(the first figure and the same with #101 ), and still got the error after the string in the AWS_API emptied.

LongZhao1992 commented 5 years ago

package.json file in backend folder:

{
  "name": "backend",
  "version": "1.0.0",
  "description": "eg-react backend",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "setup": "node setup/setupMongo.js",
    "start": "node main.js dev",
    "start-prod": "node main.js prod",
    "start-api": "node main.js api"
  },
  "author": "",
  "license": "MIT",
  "dependencies": {
    "assert": "^1.4.1",
    "boom": "^7.2.0",
    "good": "^8.0.0",
    "good-console": "^7.1.0",
    "good-squeeze": "^5.0.2",
    "hapi": "^17.2.0",
    "hapi-swagger": "^9.1.1",
    "inert": "^5.1.0",
    "joi": "^13.1.2",
    "lodash": "^4.17.5",
    "mongodb": "^3.0.1",
    "vision": "^5.3.1",
    "yesno": "0.0.1"
  }
}

And the package.json file in frontend folder is :

{
  "name": "epgg",
  "version": "48.4.6",
  "author": "Ting Wang Lab @WUSTL",
  "repository": {
    "type": "git",
    "url": "https://github.com/lidaof/eg-react.git"
  },
  "scripts": {
    "build": "react-app-rewired build --scripts-version react-scripts-ts",
    "build-dist": "rm -f umd/* && cd build && cp static/js/*.js ../umd/epgg.js && cp static/css/*.css ../umd/epgg.css && cp *worker.js ../umd/ && cd ../umd && sed -i ''  's//browser/./g' *.js",
    "build-storybook": "build-storybook -s public",
    "eject": "react-scripts-ts eject",
    "start": "react-app-rewired start --scripts-version react-scripts-ts",
    "storybook": "start-storybook -p 9009 -s public",
    "test": "react-app-rewired test --env=jsdom --scripts-version react-scripts-ts",
    "deploy": "aws s3 sync ~/eg-react/frontend/build/ s3://epigenomegateway.org/browser/ --delete",
    "build-pkg": "rm -rf dist && cross-env NODE_ENV=production babel src/ --out-dir dist --extensions \".ts,.tsx,.js,.jsx\" --copy-files --ignore __tests__,spec.js,test.js,__snapshots__,umd,build,public,node_modules"
  },
  "dependencies": {},
  "peerDependencies": {
    "prop-types": "^15.6.0",
    "react": "^16.3.0",
    "react-dom": "^16.3.0"
  },
  "devDependencies": {
    "@babel/cli": "^7.1.5",
    "@babel/core": "^7.1.5",
    "@babel/plugin-proposal-class-properties": "^7.1.0",
    "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
    "@babel/preset-env": "^7.1.5",
    "@babel/preset-react": "^7.0.0",
    "@babel/preset-typescript": "^7.1.0",
    "@gmod/bam": "^1.0.18",
    "@storybook/addon-actions": "^3.3.15",
    "@storybook/addon-links": "^3.3.15",
    "@storybook/addons": "^3.3.15",
    "@storybook/react": "^3.3.15",
    "@types/d3-axis": "^1.0.10",
    "@types/d3-scale": "^2.0.1",
    "@types/d3-selection": "^1.3.1",
    "@types/jest": "^23.0.0",
    "@types/jquery": "^3.3.2",
    "@types/json5": "^0.0.29",
    "@types/lodash": "^4.14.109",
    "@types/memoize-one": "^3.1.1",
    "@types/node": "^10.3.2",
    "@types/query-string": "^6.1.0",
    "@types/react": "^16.3.17",
    "@types/react-dom": "^16.0.6",
    "@types/react-notify-toast": "^0.5.1",
    "@types/react-redux": "^6.0.2",
    "@types/shortid": "0.0.29",
    "@types/text-encoding": "0.0.35",
    "@types/uuid": "^3.4.3",
    "array-smooth": "^1.0.0",
    "axios": "^0.16.2",
    "babel-cli": "^6.26.0",
    "babel-plugin-transform-decorators-legacy": "^1.3.5",
    "circos": "^2.1.0",
    "cross-env": "^5.2.0",
    "d3": "^4.12.0",
    "enzyme": "^3.3.0",
    "enzyme-adapter-react-16": "^1.1.1",
    "firebase": "^5.4.0",
    "fuse.js": "^3.4.4",
    "generic-filehandle": "^1.0.8",
    "hic-straw": "^0.9.3",
    "jest-image-snapshot": "^1.0.1",
    "jquery": "^3.2.1",
    "jquery.kinetic": "^2.2.4",
    "json5": "^1.0.1",
    "jsonschema": "^1.2.0",
    "lodash": "^4.17.5",
    "memoize-one": "^3.1.1",
    "nightmare": "^2.10.0",
    "parse-color": "^1.0.0",
    "promise-worker": "^1.1.1",
    "prop-types": "^15.6.0",
    "query-string": "^6.1.0",
    "react": "^16.3.0",
    "react-app-rewired": "^1.3.5",
    "react-autosuggest": "^9.3.2",
    "react-beautiful-dnd": "^3.0.0",
    "react-bootstrap-tabs": "^1.0.2",
    "react-collapsible": "^2.3.1",
    "react-color": "^2.14.0",
    "react-compound-slider": "^0.20.1",
    "react-copy-to-clipboard": "^5.0.1",
    "react-dom": "^16.3.0",
    "react-hot-keys": "^1.2.2",
    "react-modal": "^3.6.1",
    "react-notify-toast": "^0.5.0",
    "react-popper": "^0.8.2",
    "react-radio-buttons": "^1.2.2",
    "react-radio-group": "^3.0.3",
    "react-redux": "^5.0.7",
    "react-redux-firebase": "^2.1.8",
    "react-router-dom": "^4.3.1",
    "react-scripts-ts": "^2.16.0",
    "react-sortable-hoc": "^1.6.1",
    "react-speech-recognition": "^1.0.7",
    "react-table": "^6.7.4",
    "react-test-renderer": "^16.3.0",
    "redux-undo": "^1.0.0-beta9-9-7",
    "script-loader": "^0.7.2",
    "shortid": "^2.2.13",
    "tcp-port-used": "^0.1.2",
    "text-encoding": "^0.7.0",
    "typescript": "^2.9.2",
    "underscore": "^1.8.3",
    "uuid": "^3.3.2",
    "worker-loader": "^1.1.1",
    "zlib": "^1.0.5"
  },
  "license": "SEE LICENSE IN LICENSE.txt",
  "keywords": [
    "WashU Epigenome Browser",
    "genomics",
    "data visualization"
  ],
  "module": "dist/lib.js",
  "files": [
    "umd",
    "dist"
  ],
  "description": "WashU Epigenome Browser",
  "homepage": "http://epigenomegateway.wustl.edu/browser/"
  }

"http://localhost:3000/documentation" can not be opened. Indeed got "404 page not found" Thank you for your time in advance. Regards.

lidaof commented 5 years ago

Hi @LongZhao1992 , can you go though #101 again please? the proxy need to be in backend's package.json file. localhost:3001 is for backend which serves data API, localhost:3000 is for frontend which servers browser code. Another thing, if you use our own API, is it working? Thank you!

LongZhao1992 commented 5 years ago

Thank you @lidaof , your API works well. I have read #101 again, and modified some content of my files, but it still does not work. I'm so sorry. To be honest, I' m not familiar with this field. frontend/src/dataSources/GeneSource.js:

export const AWS_API = "";

return axios.get(`/${genome}/genes/${this.trackModel.name}/queryRegion`, {
                params: params
            });

frontend/package.json:

"proxy": "http://localhost:3000"

backend/package.json:

"proxy": "http://localhost:3001"

The error:

Proxy error: Could not proxy request /hg19/genes/gencodeV29/queryRegion?chr=chr7&start=27194360&end=27232802 from localhost:3000 to http://localhost:3000.

"http://localhost:3001/documentation" can be opened but not "http://localhost:3000/documentation"

Need I use nginx as you mentioned? I am sorry about so many questions. emm... There may be a long way to go for my custom genome building.

Best.

lidaof commented 5 years ago

Hi @LongZhao1992 , don't be sorry it's ok. Glad we are making progress.

You don't need proxy in frontend's package.json. Right now if it's for development purpose, you don't need nginx. can you remove the proxy in frontend?

can you open http://localhost:3001/documentation see if you can do some test query?

LongZhao1992 commented 5 years ago

Thank you so much for your patient, @lidaof. "http://localhost:3001/documentation" works well in my Linux computer, but it does not work in my PC via IP sign in. And it is strange that "http://192.168.0.106:3000/browser" can be shown in my PC but not Linux computer(It is blank with no error information, I guess it may due to the old version Firefox). I remove the proxy in frontend, and it still does not work.

lidaof commented 5 years ago

Just check, are you running backend and frontend in 2 computers?

LongZhao1992 commented 5 years ago

Oh, sorry for confusing. All the software was installed on the Linux computer. I check http://localhost:3001/documentation in Linux computer, it works. But it does not work if I use other computers via local area network. By contrast, http://localhost:3000/browser works on other computers via local area network connection, but not the Linux computer. I do not know if my expression is clear? Anyway, http://localhost:3001/documentation is alright, and shows the query.

lidaof commented 5 years ago

I think I understand you now, so both frontend and backend are running on same Linux machine. can you send me screenshots of the query of your localhost:3001 and the error of localhost:3000.

LongZhao1992 commented 5 years ago

Linux machine: image Screenshot-1 Screenshot-2 image


Other computer with local area network connection:

image image image image

Thank you! @lidaof

lidaof commented 5 years ago

Hi @LongZhao1992 , these are pretty normal except last one. can you send one with development console opened? in chrome, More tools -> development tools -> console. I would like to see the error log. Firefox have similar function.

LongZhao1992 commented 5 years ago

chrome image

Firefox Screenshot

lidaof commented 5 years ago

can you make sure in your backend json you have this "proxy": "http://localhost:3001" and the GeneSource.js file you emptied the AWS_API variable?

LongZhao1992 commented 5 years ago

Yes. Isn't right? image image

LongZhao1992 commented 5 years ago

Is there a problem here? image

lidaof commented 5 years ago

this looks good. ok, can you do this:

  1. close both backend and frontend.
  2. start frontend
  3. start backend
  4. test if you can open http://localhost:3001/documentation
  5. open http://localhost:3000/browser with console window, see if there is any error
LongZhao1992 commented 5 years ago

Windows computer chrom: image image Linux Firefox: image image

Thank you so much! @lidaof

lidaof commented 5 years ago

you are welcome @LongZhao1992 .

This is very strange that based on the GeneSource.js file you pasted, in the Chrome window, the request should go to /araTh1/xxxx, the leading slash / is missed...can you check?

LongZhao1992 commented 5 years ago

OK, I will try my best. By the way, may I get the right GeneSource.js file from you?

lidaof commented 5 years ago

the file is always at this repo: https://github.com/lidaof/eg-react/blob/master/frontend/src/dataSources/GeneSource.js

if you can setup a teamviewer on the linux machine, i can try to remote control to debug.

LongZhao1992 commented 5 years ago

Is that right? I really don't know how to thank you. I will try my best to fix the problem first, and may need your help if I have no idea. I really appreciate your time these days.

lidaof commented 5 years ago

sure thing, teamviewer is a software which i can remote login your computer, https://www.teamviewer.com/en/download/linux/ feel free to let me know if you need me to remote control. you are always welcome.