webgl2-fundamentals icon indicating copy to clipboard operation
webgl2-fundamentals copied to clipboard

Build this project on my own mac

Open Mirocos opened this issue 3 years ago • 10 comments

I want build this web project to my own mac, so I can read some source code and try to edit it. But I always failed when I use npm install to download those necessary module. The point that causes failures seems to be install module from github...(I try to use proxy, but it doesn't work)

Is there any way that I could build it successfully?

Mirocos avatar Jul 20 '20 09:07 Mirocos

installing modules from github is normal. What errors are you getting?

greggman avatar Jul 20 '20 10:07 greggman

installing modules from github is normal. What errors are you getting? I am always stuck in this module. image It seems that install just stop at this module.

Mirocos avatar Jul 20 '20 12:07 Mirocos

You could try deleting package-lock.json and editing package.json these 2 lines

"@gfxfundamentals/lesson-builder": "git://github.com/gfxfundamentals/lesson-builder.git#v1.4.1",
"@gfxfundamentals/live-editor": "git://github.com/gfxfundamentals/live-editor.git#v1.0.8",

Change to this

"@gfxfundamentals/lesson-builder": "https://github.com/gfxfundamentals/lesson-builder.git#v1.4.1",
"@gfxfundamentals/live-editor": "https://github.com/gfxfundamentals/live-editor.git#v1.0.8",

or this

"@gfxfundamentals/lesson-builder": "git+https://github.com/gfxfundamentals/lesson-builder.git#v1.4.1",
"@gfxfundamentals/live-editor": "git+https://github.com/gfxfundamentals/live-editor.git#v1.0.8",

and see if that fixes anything. I doubt since it's working for others. In fact you cloned the main repo from github and you're here commenting on github so it should be no different.

greggman avatar Jul 20 '20 13:07 greggman

You could try deleting package-lock.json and editing package.json these 2 lines

"@gfxfundamentals/lesson-builder": "git://github.com/gfxfundamentals/lesson-builder.git#v1.4.1",
"@gfxfundamentals/live-editor": "git://github.com/gfxfundamentals/live-editor.git#v1.0.8",

Change to this

"@gfxfundamentals/lesson-builder": "https://github.com/gfxfundamentals/lesson-builder.git#v1.4.1",
"@gfxfundamentals/live-editor": "https://github.com/gfxfundamentals/live-editor.git#v1.0.8",

or this

"@gfxfundamentals/lesson-builder": "git+https://github.com/gfxfundamentals/lesson-builder.git#v1.4.1",
"@gfxfundamentals/live-editor": "git+https://github.com/gfxfundamentals/live-editor.git#v1.0.8",

and see if that fixes anything. I doubt since it's working for others. In fact you cloned the main repo from github and you're here commenting on github so it should be no different.

I am sorry I have tried these two ways. And now it still fail like this(while i use sudo npm install) image

Or stuck at this like(use npm install without sudo...),sometime when I reinstall and it may not be this module in the picture but others.

image

Mirocos avatar Jul 20 '20 13:07 Mirocos

You should almost never use sudo with npm

this repo certainly doesn't need sudo.

I am not an npm expert. If it was me I'd probably delete /Users/mirocros/.npm or rename it and start over. Maybe install node again. Sorry I don't have any answers.

On mac I use nvm to install node. No sudo needed.

greggman avatar Jul 20 '20 14:07 greggman

Yes, I notice that it should never use sudo with npm. I just have no idea how to build this project successfully, All I want to know is the state-diagram(Could you take this part  or demo out if you do not mind).I try to build it on Mac or Win10. All failed with the first problem in the first comment.  Anyway, thanks for your help.

------------------ 原始邮件 ------------------ 发件人: "gfxfundamentals/webgl2-fundamentals" <[email protected]>; 发送时间: 2020年7月20日(星期一) 晚上10:14 收件人: "gfxfundamentals/webgl2-fundamentals"<[email protected]>; 抄送: "Fingers°"<[email protected]>;"Author"<[email protected]>; 主题: Re: [gfxfundamentals/webgl2-fundamentals] Build this project on my own mac (#79)

You should almost never use sudo with npm

this repo certainly doesn't need sudo.

I am not an npm expert. If it was me I'd probably delete /Users/mirocros/.npm or rename it and start over. Maybe install node again. Sorry I don't have any answers.

On mac I use nvm to install node. No sudo needed.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub, or unsubscribe.

Mirocos avatar Jul 20 '20 14:07 Mirocos

I'm sorry you're running into problems. I don't know how to help. It's should be as simple as

git clone https://github.com/gfxfundamentals/webgl2-fundamentals.git
cd webgl2-fundamentals
npm install
npm run build
npm start

And AFAICT it is that simple for most people. I build on 2 macs, a windows PC, and a linux machine.

On Mac I used nvm to install node. I added the required lines to my .bash_profile and my .zshrc files

ATM I'm using node 12.18.0

nvm install 12.18.0

greggman avatar Jul 21 '20 03:07 greggman

Note: you can download the built site here

greggman avatar Jul 21 '20 03:07 greggman

Oh, one more thing, building doesn't do anything except build the articles from .md files into .html files and generate the table of contents. All the examples and diagrams just run without building. That includes the state diagram. If you just clone the repo and serve the base folder

git clone https://github.com/gfxfundamentals/webgl2-fundamentals.git
servez webgl2-fundamentals

You can the state diagram at http://localhost:8080/webgl/lessons/resources/webgl-state-diagram.html

I used servez above but you can use any web server

greggman avatar Jul 22 '20 03:07 greggman

As suggested, "Permission denied" is due to the system installs, system node.js interfering most likely. Install nvm (via https://github.com/nvm-sh/nvm, "Git Install" section works for me, but I am on Ubuntu 20.04). See also "Troubleshooting on macOS" there in case you don't pass this stage as this might help you to find out if something is busted around Xcode, git and shell, if you cannot pass this stage, nuke your mac from orbit). Check that git clones by default into your home related folders, not into the system, install nvm without any sudo, and then install node via "nvm install node", this will deactivate the system node.

To deal with frequently occurring npm deprecation warnings or even errors, this is often useful for me: https://stackoverflow.com/questions/42308879/how-to-solve-npm-error-npm-err-code-elifecycle That is, inside the problematic folder run this:

npm cache clean --force
rm -rf node_modules package-lock.json

aabbtree77 avatar Sep 02 '20 21:09 aabbtree77