무료
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm run dev 동작 에러
Failed to parse source map from 'C:\Users\user\Desktop\boilerplate-mern-stack-master\client\node_modules\mutationobserver-shim\dist\mutationobserver.map' file: Error: ENOENT: no such file or directory, open 'C:\Users\user\Desktop\boilerplate-mern-stack-master\client\node_modules\mutationobserver-shim\dist\mutationobserver.map' [1][1] ERROR in ./node_modules/antd/es/version/index.js 2:15-22[1] Should not import the named export 'version' (imported as 'version') from default-exporting module (only default export is available soon)이런 에러가 뜨는데 어떻게 해결하나요...도와주세요
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm run dev 동작 에러
ERROR in ./node_modules/antd/es/version/index.js 2:15-22[1] Should not import the named export 'version' (imported as 'version') from default-exporting module (only default export is available soon) 이런 에러가 뜨는데 어떻게 해결하나요...
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm run dev 동작에러납니다...
PS C:\Users\Desktop\boilerplate-mern-stack> yarn dev yarn run v1.22.19 $ concurrently "npm run backend" "npm run start --prefix client" [1] [1] > client@0.1.0 start [1] > react-scripts start [1] [0] [0] > react-boiler-plate@1.0.0 backend [0] > nodemon server/index.js [0] [0] [nodemon] 1.19.4 [0] [nodemon] to restart at any time, enter `rs` [0] [nodemon] watching dir(s): *.* [0] [nodemon] watching extensions: js,mjs,json [0] [nodemon] starting `node server/index.js` [0] Server Listening on 5000 [0] MongooseError: The `uri` parameter to `openUri()` must be a string, got "undefined". Make sure the first parameter to `mongoose.connect()` or `mongoose.createConnection()` is a string. [0] at Connection.openUri (C:\Users\Desktop\boilerplate-mern-stack\node_modules\mongoose\lib\connection.js:694:11) [0] at C:\Users\Desktop\boilerplate-mern-stack\node_modules\mongoose\lib\index.js:351:10 [0] at C:\Users\Desktop\boilerplate-mern-stack\node_modules\mongoose\lib\helpers\promiseOrCallback.js:32:5 [0] at new Promise (<anonymous>) [0] at promiseOrCallback (C:\Users\Desktop\boilerplate-mern-stack\node_modules\mongoose\lib\helpers\promiseOrCallback.js:31:10) [0] at Mongoose._promiseOrCallback (C:\Users\Desktop\boilerplate-mern-stack\node_modules\mongoose\lib\index.js:1149:10) [0] at Mongoose.connect (C:\Users\Desktop\boilerplate-mern-stack\node_modules\mongoose\lib\index.js:350:20) [0] at Object.<anonymous> (C:\Users\Desktop\boilerplate-mern-stack\server\index.js:19:4) [0] at Module._compile (node:internal/modules/cjs/loader:1233:14) [0] at Module._extensions..js (node:internal/modules/cjs/loader:1287:10) [0] at Module.load (node:internal/modules/cjs/loader:1091:32) [0] at Module._load (node:internal/modules/cjs/loader:938:12) [0] at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:83:12) [0] at node:internal/main/run_main_module:23:47 [1] [HPM] Proxy created: / -> http://localhost:5000 [1] i 「wds」: Project is running at http://192.999.111.116/ [1] i 「wds」: webpack output is served from [1] i 「wds」: Content not from webpack is served from C:\Users\Desktop\boilerplate-mern-stack\client\public [1] i 「wds」: 404s will fallback to / [1] Starting the development server... [1] [1] Error: error:0308010C:digital envelope routines::unsupported [1] at new Hash (node:internal/crypto/hash:69:19) [1] at Object.createHash (node:crypto:138:10) [1] at module.exports (C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\util\createHash.js:135:53) [1] at NormalModule._initBuildHash (C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\NormalModule.js:417:16) [1] at handleParseError (C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\NormalModule.js:471:10) [1] at C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\NormalModule.js:503:5 [1] at C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\NormalModule.js:358:12 [1] at C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\loader-runner\lib\LoaderRunner.js:373:3 [1] at iterateNormalLoaders (C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\loader-runner\lib\LoaderRunner.js:214:10) [1] at iterateNormalLoaders (C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\loader-runner\lib\LoaderRunner.js:221:10) [1] C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\react-scripts\scripts\start.js:19 [1] throw err; [1] ^ [1] [1] Error: error:0308010C:digital envelope routines::unsupported [1] at new Hash (node:internal/crypto/hash:69:19) [1] at Object.createHash (node:crypto:138:10) [1] at module.exports (C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\util\createHash.js:135:53) [1] at NormalModule._initBuildHash (C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\NormalModule.js:417:16) [1] at C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\NormalModule.js:452:10 [1] at C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\webpack\lib\NormalModule.js:323:13 [1] at C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\loader-runner\lib\LoaderRunner.js:367:11 [1] at C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\loader-runner\lib\LoaderRunner.js:233:18 [1] at context.callback (C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\loader-runner\lib\LoaderRunner.js:111:13) [1] at C:\Users\Desktop\boilerplate-mern-stack\client\node_modules\react-scripts\node_modules\babel-loader\lib\index.js:59:103 { [1] opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ], [1] library: 'digital envelope routines', [1] reason: 'unsupported', [1] code: 'ERR_OSSL_EVP_UNSUPPORTED' [1] } [1] [1] Node.js v20.5.1 [1] npm run start --prefix client exited with code 1반나절 넘게 이 오류만 붙잡고 있었는데 해결이 안되네요...사이트에 연결할 수 없음연결이 재설정되었습니다.다음 방법을 시도해 보세요.연결 확인프록시 및 방화벽 확인Windows 네트워크 진단 프로그램 실행브라우저에서 위와 같이 뜨는데 이유가 뭘까요....
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm run dev 실행 오류
Should not import the named export 'version' (imported as 'version') from default-exporting module (only default export is available soon) npm run dev를 실행했더니 이런 오류가 떠요.....도와주세요ㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜㅜ
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
비디오 업로드, 로그인, 회원가입 504 error
안녕하세요 http://localhost:3000/video/upload 실행해 비디오를 선택하면 POST http://localhost:3000/api/video/uploadfiles 504 (Gateway Timeout),http://localhost:3000/register실행해 가입을 하려하면POST http://localhost:3000/api/users/register 504 (Gateway Timeout)Uncaught (in promise) Error: Request failed with status code 504이런 에러가 나옵니다 vscode 에서는 Server Listening on 5000[0] MongoError: bad auth : authentication failed[0] at MessageStream.messageHandler (C:\Han\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\mongoose\node_modules\mongodb\lib\cmap\connection.js:299:20) [0] at MessageStream.emit (node:events:520:28)[0] at processIncomingData (C:\Han\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\mongoose\node_modules\mongodb\lib\cmap\message_stream.js:144:12) [0] at MessageStream._write (C:\Han\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\mongoose\node_modules\mongodb\lib\cmap\message_stream.js:42:5) [0] at writeOrBuffer (node:internal/streams/writable:389:12)[0] at _write (node:internal/streams/writable:330:10)[0] at MessageStream.Writable.write (node:internal/streams/writable:334:10)[0] at TLSSocket.ondata (node:internal/streams/readable:754:22)[0] at TLSSocket.emit (node:events:520:28)[0] at addChunk (node:internal/streams/readable:315:12)[0] at readableAddChunk (node:internal/streams/readable:289:9)[0] at TLSSocket.Readable.push (node:internal/streams/readable:228:10)[0] at TLSWrap.onStreamRead (node:internal/stream_base_commons:190:23) {[0] ok: 0,[0] code: 8000,[0] codeName: 'AtlasError'[0] } ,Error: ffmpeg exited with code 4294967291: frame= 1 fps=0.0 q=-0.0 Lq=-0.0 q=-0.0 size=N/A time=00:00:00.00 bitrate=N/A dup=2 drop=0 speed= 0x [0] video:199kB audio:0kB subtitle:0kB other streams:0kB global headers:0kB muxing overhead: unknown[0] Conversion failed![0][0] at ChildProcess.<anonymous> (C:\Han\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\fluent-ffmpeg\lib\processor.js:182:22)[0] at ChildProcess.emit (node:events:520:28)[0] at Process.ChildProcess._handle.onexit (node:internal/child_process:291:12)[0] Waiting for the debugger to disconnect...[0] node:events:498[0] throw er; // Unhandled 'error' event[0] ^[0][0] MongooseError: Operation `users.findOne()` buffering timed out after 10000ms[0] at Timeout.<anonymous> (C:\Han\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\mongoose\lib\drivers\node-mongodb-native\collection.js:198:23)[0] at listOnTimeout (node:internal/timers:559:17)[0] at processTimers (node:internal/timers:502:7)[0] Emitted 'error' event on Function instance at:[0] at C:\Han\boilerplate-mern-stack-master\boilerplate-mern-stack-master\node_modules\mongoose\lib\model.js:5084:15[0] at processTicksAndRejections (node:internal/process/task_queues:78:11)[1] [HPM] Error occurred while trying to proxy request /api/users/auth from localhost:3000 to http://localhost:5000 (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)[0] [nodemon] app crashed - waiting for file changes before starting...[1] [HPM] Error occurred while trying to proxy request /api/users/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/users/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/users/register from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/video/getVideos from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/users/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/users/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/video/uploadfiles from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/users/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/users/auth from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors)[1] [HPM] Error occurred while trying to proxy request /api/users/register from localhost:3000 to http://localhost:5000 (ECONNREFUSED) (https://nodejs.org/api/errors.html#errors_common_system_errors) 이렇게 나옵니다어떻게 해결해야 할까요 깃허브 https://github.com/Hanboreum/boilerplate-mern-stack-master
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
시작부터 오류생기시는 분들 해결법입니다.
boiler plate폴더의 루트 디렉토리의 package.json 에서 bcrypt 를 없애고 npm install 을 해줍니다.이후 npm install bcryptjs --save 를 루트 디렉토리에 설치해줍니다.sever > models > User.js 에서 상단의 const bcrypt = require('bcryptjs') 로 변경해줍니다.sever > models > User.js 파일의 85번째 줄의 "_id" : decoded 부분을 decode 로 변경해줍니다.client폴더로 넘어가서 package.json 은 건들지 않고 npm install 을 해줍니다.위치를 boiler plate 폴더의 루트 디렉토리로 넘어가서 npm run dev 를 실행시켜줍니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
오류 해결 공유
서버에서 npm install 오류 bcrypt 버전을 최신으로 올려주세요.저는 5.1.1 버전입니다.npm run dev 오류시 [오류내용]client -> package.json -> react-scripts 버전을 수정하세요. *package.json을 수정하면 npm install을 다시 진행해서 node_modules을 다시 설치해야 됩니다.npm run dev 실행 후 오류해당 파일을 찾아이 부분을 수정해주면 됩니다. setupMiddlewares: (middlewares, devServer) => { if (!devServer) { throw new Error('webpack-dev-server is not defined') } if(fs.existsSync(paths.proxySetup)) { require(paths.proxySetup)(devServer.app) } middlewares.push( evalSourceMapMiddleware(devServer), redirectServedPath(paths.publicUrlOrPath), noopServiceWorkerMiddleware(paths.publicUrlOrPath) ) return middlewares; },
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm install 에러 질문드립니다.
2번째 강의 #2 전체적인 틀 만들고 MongoDB 연결파트에서터미널에서 파워셀로 npm install 명령어 실행시 아래와 같은 에러가 발생됩니다. node -v 입력시에 v18.13.0이라고 나오는데 버전 문제인 걸까요? 강의에서는 v10.16.0 으로 나오기는 합니다. 그래서 노드 버전 v10.16.0 으로 낮춰보려고 하는데 node.js페이지에서는 해당 버전은 찾을수가 없네요. 어떻게 해야되나요? 해결 방법 좀 알려주세요. 감사합니다 . --- 아래 ---npm ERR! code 1npm ERR! path C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\bcryptnpm ERR! command failednpm ERR! command C:\WINDOWS\system32\cmd.exe /d /s /c node-pre-gyp install --fallback-to-buildnpm ERR! Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\YSH\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node --module_name=bcrypt_lib --module_path=C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v108' (1)npm ERR! node-pre-gyp info it worked if it ends with oknpm ERR! node-pre-gyp info using node-pre-gyp@0.14.0npm ERR! node-pre-gyp info using node@18.13.0 | win32 | x64npm ERR! node-pre-gyp WARN Using needle for node-pre-gyp https downloadnpm ERR! node-pre-gyp info check checked for "C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node" (not found)npm ERR! node-pre-gyp http GET https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v108-win32-x64-unknown.tar.gznpm ERR! node-pre-gyp http 404 https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v108-win32-x64-unknown.tar.gznpm ERR! node-pre-gyp WARN Tried to download(404): https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v108-win32-x64-unknown.tar.gznpm ERR! node-pre-gyp WARN Pre-built binaries not found for bcrypt@3.0.8 and node@18.13.0 (node-v108 ABI, unknown) (falling back to source compile with node-gyp)npm ERR! node-pre-gyp http 404 status code downloading tarball https://github.com/kelektiv/node.bcrypt.js/releases/download/v3.0.8/bcrypt_lib-v3.0.8-node-v108-win32-x64-unknown.tar.gznpm ERR! gyp info it worked if it ends with oknpm ERR! gyp info using node-gyp@9.3.1npm ERR! gyp info using node@18.13.0 | win32 | x64npm ERR! gyp info oknpm ERR! gyp info it worked if it ends with oknpm ERR! gyp info using node-gyp@9.3.1npm ERR! gyp info using node@18.13.0 | win32 | x64npm ERR! gyp ERR! find Pythonnpm ERR! gyp ERR! find Python Python is not set from command line or npm configurationnpm ERR! gyp ERR! find Python Python is not set from environment variable PYTHONnpm ERR! gyp ERR! find Python checking if "python3" can be usednpm ERR! gyp ERR! find Python - "python3" is not in PATH or produced an errornpm ERR! gyp ERR! find Python checking if "python" can be usednpm ERR! gyp ERR! find Python - "python" is not in PATH or produced an errornpm ERR! gyp ERR! find Python checking if Python is C:\Users\YSH\AppData\Local\Programs\Python\Python39\python.exenpm ERR! gyp ERR! find Python - "C:\Users\YSH\AppData\Local\Programs\Python\Python39\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python39\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python39\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\YSH\AppData\Local\Programs\Python\Python39-32\python.exenpm ERR! gyp ERR! find Python - "C:\Users\YSH\AppData\Local\Programs\Python\Python39-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python39-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python39-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python39-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python39-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\YSH\AppData\Local\Programs\Python\Python38\python.exenpm ERR! gyp ERR! find Python - "C:\Users\YSH\AppData\Local\Programs\Python\Python38\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python38\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python38\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\YSH\AppData\Local\Programs\Python\Python38-32\python.exenpm ERR! gyp ERR! find Python - "C:\Users\YSH\AppData\Local\Programs\Python\Python38-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python38-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python38-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python38-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python38-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\YSH\AppData\Local\Programs\Python\Python37\python.exenpm ERR! gyp ERR! find Python - "C:\Users\YSH\AppData\Local\Programs\Python\Python37\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python37\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python37\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\YSH\AppData\Local\Programs\Python\Python37-32\python.exenpm ERR! gyp ERR! find Python - "C:\Users\YSH\AppData\Local\Programs\Python\Python37-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python37-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python37-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python37-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python37-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\YSH\AppData\Local\Programs\Python\Python36\python.exenpm ERR! gyp ERR! find Python - "C:\Users\YSH\AppData\Local\Programs\Python\Python36\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python36\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python36\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Users\YSH\AppData\Local\Programs\Python\Python36-32\python.exenpm ERR! gyp ERR! find Python - "C:\Users\YSH\AppData\Local\Programs\Python\Python36-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files\Python36-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files\Python36-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if Python is C:\Program Files (x86)\Python36-32\python.exenpm ERR! gyp ERR! find Python - "C:\Program Files (x86)\Python36-32\python.exe" could not be runnpm ERR! gyp ERR! find Python checking if the py launcher can be used to find Python 3npm ERR! gyp ERR! find Python - "py.exe" is not in PATH or produced an errornpm ERR! gyp ERR! find Pythonnpm ERR! gyp ERR! find Python **********************************************************npm ERR! gyp ERR! find Python You need to install the latest version of Python.npm ERR! gyp ERR! find Python Node-gyp should be able to find and use Python. If not,npm ERR! gyp ERR! find Python you can try one of the following options:npm ERR! gyp ERR! find Python - Use the switch --python="C:\Path\To\python.exe"npm ERR! gyp ERR! find Python (accepted by both node-gyp and npm)npm ERR! gyp ERR! find Python - Set the environment variable PYTHONnpm ERR! gyp ERR! find Python - Set the npm configuration variable python:npm ERR! gyp ERR! find Python npm config set python "C:\Path\To\python.exe"npm ERR! gyp ERR! find Python For more information consult the documentation at:npm ERR! gyp ERR! find Python https://github.com/nodejs/node-gyp#installationnpm ERR! gyp ERR! find Python **********************************************************npm ERR! gyp ERR! find Pythonnpm ERR! gyp ERR! configure errornpm ERR! gyp ERR! stack Error: Could not find any Python installation to usenpm ERR! gyp ERR! stack at PythonFinder.fail (C:\Users\YSH\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-python.js:330:47)npm ERR! gyp ERR! stack at PythonFinder.runChecks (C:\Users\YSH\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-python.js:159:21)npm ERR! gyp ERR! stack at PythonFinder.<anonymous> (C:\Users\YSH\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-python.js:228:18)npm ERR! gyp ERR! stack at PythonFinder.execFileCallback (C:\Users\YSH\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\lib\find-python.js:294:16)npm ERR! gyp ERR! stack at exithandler (node:child_process:427:5)npm ERR! gyp ERR! stack at ChildProcess.errorhandler (node:child_process:439:5)npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:513:28)npm ERR! gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:289:12)npm ERR! gyp ERR! stack at onErrorNT (node:internal/child_process:476:16)npm ERR! gyp ERR! stack at process.processTicksAndRejections (node:internal/process/task_queues:82:21)npm ERR! gyp ERR! System Windows_NT 10.0.22621npm ERR! gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\YSH\\AppData\\Roaming\\npm\\node_modules\\npm\\node_modules\\node-gyp\\bin\\node-gyp.js" "configure" "--fallback-to-build" "--module=C:\\Users\\YSH\\Desktop\\코딩\\배틀코딩\\youtube\\boilerplate-mern-stack-master\\node_modules\\bcrypt\\lib\\binding\\bcrypt_lib.node" "--module_name=bcrypt_lib" "--module_path=C:\\Users\\YSH\\Desktop\\코딩\\배틀코딩\\youtube\\boilerplate-mern-stack-master\\node_modules\\bcrypt\\lib\\binding" "--napi_version=8" "--node_abi_napi=napi" "--napi_build_version=0" "--node_napi_label=node-v108"npm ERR! gyp ERR! cwd C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\bcryptnpm ERR! gyp ERR! node -v v18.13.0npm ERR! gyp ERR! node-gyp -v v9.3.1npm ERR! gyp ERR! not oknpm ERR! node-pre-gyp ERR! build errornpm ERR! node-pre-gyp ERR! stack Error: Failed to execute 'C:\Program Files\nodejs\node.exe C:\Users\YSH\AppData\Roaming\npm\node_modules\npm\node_modules\node-gyp\bin\node-gyp.js configure --fallback-to-build --module=C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding\bcrypt_lib.node --module_name=bcrypt_lib --module_path=C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\bcrypt\lib\binding --napi_version=8 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v108' (1)npm ERR! node-pre-gyp ERR! stack at ChildProcess.<anonymous> (C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\node-pre-gyp\lib\util\compile.js:83:29)npm ERR! node-pre-gyp ERR! stack at ChildProcess.emit (node:events:513:28)npm ERR! node-pre-gyp ERR! stack at maybeClose (node:internal/child_process:1091:16)npm ERR! node-pre-gyp ERR! stack at ChildProcess._handle.onexit (node:internal/child_process:302:5)npm ERR! node-pre-gyp ERR! System Windows_NT 10.0.22621npm ERR! node-pre-gyp ERR! command "C:\\Program Files\\nodejs\\node.exe" "C:\\Users\\YSH\\Desktop\\코딩\\배틀코딩\\youtube\\boilerplate-mern-stack-master\\node_modules\\node-pre-gyp\\bin\\node-pre-gyp" "install" "--fallback-to-build"npm ERR! node-pre-gyp ERR! cwd C:\Users\YSH\Desktop\코딩\배틀코딩\youtube\boilerplate-mern-stack-master\node_modules\bcryptnpm ERR! node-pre-gyp ERR! node -v v18.13.0npm ERR! node-pre-gyp ERR! node-pre-gyp -v v0.14.0npm ERR! node-pre-gyp ERR! not ok
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
아예 몽고DB에 연결한다고만 하고 연결이 안되고 있습니다.
> npm run dev > react-boiler-plate@1.0.0 dev > concurrently "npm run backend" "npm run start --prefix client" [1] [1] > client@0.1.0 start [1] > react-scripts start [1] [0] [0] > react-boiler-plate@1.0.0 backend [0] > nodemon server/index.js [0] [1] 'react-scripts'��(��) ���� �Ǵ� �ܺ� ����, ������ �� �ִ� ���α�, �Ǵ� [1] ��ġ ������ �ƴմϴ�. [1] npm run start --prefix client exited with code 1 [0] [nodemon] 2.0.22 [0] [nodemon] to restart at any time, enter `rs` [0] [nodemon] watching path(s): *.* [0] [nodemon] watching extensions: js,mjs,json [0] [nodemon] starting `node server/index.js` [0] Server Listening on 5000 [0] (node:9644) [DEP0170] DeprecationWarning: The URL mongodb://hwangjyoung27:tf933725@ac-xjv9w4y-shard-00-02.gefw08m.mongodb.net:27017,ac-xjv9w4y-shard-00-00.gefw08m.mongodb.net:27017,ac-xjv9w4y-shard-00-01.gefw08m.mongodb.net:27017/?authSource=admin&replicaSet=atlas-9r8jq0-shard-0&retryWrites=true&w=majority&ssl=true is invalid. Future versions of Node.js will throw an error. [0] (Use `node --trace-deprecation ...` to show where the warning was created) [0] MongoDB Connected...
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
해당 오류 해결 방법 좀 알려주세요 ㅠㅠ
위의 오류 해결방법좀 알려주세요 ㅠ
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
로컬스토리지에 대한 질문입니다!!
안녕하세요 강사님!! 다름이 아니라 로컬스토리지에 대해 질문을 드리려고 합니다!!강사님께서 첨부하신 boiler-plate을 사용하지 않고, 이전의 boiler-plate 강의 수강 후 직접 작성한 파일을 그대로 가져와서 youtube 강의를 듣고 있습니다.로그인 페이지에서 로그인을 하게 되면, 로컬스토리지에 userId가 저장될 수 있게 기능을 구현하려 하는데, 아래와 같이 어딘가로 저장은 되지만 어플리케이션 탭의 로컬스토리지에는 표시가 되지 않습니다. 혹시 어떤 이유 때문에 이러 일이 일어나는지 알려주실 수 있으실까요!!ㅠㅠ--------------------------------------------------------------------------------------------------------------------------------------확인해보니 크롬 브라우저에는 위 사진과 같이 저장된 데이터가 표시되지 않았지만 브레이브 브라우저에서는 아래와 같이 정상적으로 표시 됐습니다!! 특이사항이 있다면 크롬 브라우저에서 로그인 할 때, 암호가 유출되었을 수도 있다는 알림이 뜨는데 그것 때문인지 궁금합니다!!
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
video가 안 나타나는 문제
video 코드를 맞게 입력했지만 표출되지 않았습니다콘솔에는 아무런 에러도 없고.. url도 문제가 없어서 이유를 찾기 어려워 리액트 라이브러리로 대체했습니다.작동은 정상적으로 되지만 앞으로 수업 듣기에 문제 없을지는 모르겠습니다.같은 문제를 겪으신 분들 참고하시면 좋겠습니다.// client npm i react-player --save // VideoDetailPage.js import ReactPlayer from 'react-player/lazy'; // video 부분 아래와 같이 대체 <ReactPlayer style={{ width : '100%' }} url={`http://localhost:5000/${VideoDetail.filePath}`} playing={true} // 자동 재생 on controls={true} // 플레이어 컨트롤 노출 여부 light={false} // 플레이어 모드 pip={true} // pip 모드 설정 여부 />
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
ffmpeg 설치 후 cannot read property 'format' of undefined 500 에러 해결
콘솔 에러POST http://localhost:3000/api/video/thumbnail 500 (Internal Server Error)터미널 에러TypeError: Cannot read properties of undefined (reading 'format')ffmpeg 관련 파일 안에 있는 format이 문제라고 에러가 떠서 처음엔 설치가 잘못된건지 재기동도 몇번하고 재부팅도 몇번 했는데 결국은 파라미터명이 문제였네요 영상에서 쓰는 파라미터명이랑 git에 올라가있는 소스의 파라미터명이랑 조금씩 달라서 영상이랑 git이랑 섞어서 보면 이런 에러가 날 수 있을 것 같습니다!vedio.js 에서 uploadfiles 성공 시 return 값으로return res.json({success:true , url: res.req.file.path , fileName: res.req.file.filename })success, url, fileName 세개를 넘겨주고화면단(VideoUploadPage.js)에서는 success, filePath, fileName 이렇게 세개를 받아와서 variable에 데이터를 넘겨주고 있었네요let variable = { filePath: response.data.filePath //-> res.req.file.path를 url으로 보내줬으니 받을때도 filePath가 아닌 url로 받아야 함. , fileName: response.data.fileName }variable을 콘솔로 찍어보고 값이 잘 넘어오지 않는 부분을 확인한다면 이 에러는 금방 해결 하실 것 같습니다!감사합니다!
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
typeError or 콘솔 500 뜨는분..
저도 잘 모르지만.. 몇시간을 찾고 구글링에.. 아무튼 그랬습니다.. 해결은 됐는데 코드를 보여드리자면routes/video.js (back단)router.post("/thumbnail", (req, res) => { let thumbsFilePath =""; let fileDuration =""; ffmpeg.ffprobe(req.body.filePath, function(err, metadata){ console.log(metadata); console.log(metadata.format.duration); fileDuration = metadata.format.duration; }) ffmpeg(req.body.filePath) .on('filenames', function (filenames) { console.log('Will generate ' + filenames.join(', ')) thumbsFilePath = "uploads/thumbnails/" + filenames[0]; }) .on('end', function () { console.log('Screenshots taken'); return res.json({ success: true, thumbsFilePath: thumbsFilePath, fileDuration: fileDuration}) }) .screenshots({ // Will take screens at 20%, 40%, 60% and 80% of the video count: 1, folder: 'uploads/thumbnails', size:'320x240', // %b input basename ( filename w/o extension ) filename:'thumbnail-%b.png' }); }); VideoUploadPage.js (front단)const onDrop = (files) => { let formData = new FormData(); const config = { header: { "content-type": "multipart/form-data" }, }; formData.append("file", files[0]); axios.post("/api/video/uploadfiles", formData, config).then((response) => { if (response.data.success) { console.log(response.data); let variable = { filePath: response.data.filePath, fileName: response.data.fileName } setFilePath(response.data.filePath) axios.post("/api/video/thumbnail", variable).then((response) => { if (response.data.success) { setDuration(response.data.fileDuration) setThumbnail(response.data.thumbsFilePath) } else { alert("썸네일 에러 발생"); } }); } else { alert("업로드 실패"); } }); };라고 됐습니다.. 혹시 필요하신분은 참조하시길 바라요~ 아 물론 윈도우라 ffmpeg 설치 해야합니다!
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
npm run dev 관련 오류
npm run dev를 하니 다음과 같은 오류가 납니다. PS C:\Users\82105\Downloads\boilerplate-mern-stack-master> npm run dev> react-boiler-plate@1.0.0 dev> concurrently "npm run backend" "npm run start --prefix client"[1] [1] > client@0.1.0 start[1] > react-scripts start[1][0][0] > react-boiler-plate@1.0.0 backend[0] > nodemon server/index.js[0][0] [nodemon] 1.19.4[0] [nodemon] to restart at any time, enter rs[0] [nodemon] watching dir(s): .[0] [nodemon] watching extensions: js,mjs,json[0] [nodemon] starting node server/index.js[0] (node:9916) Warning: Accessing non-existent property 'count' of module exports inside circular dependency[0] (Use node --trace-warnings ... to show where the warning was created)[0] Server Listening on 5000[0] (node:9916) Warning: Accessing non-existent property 'findOne' of module exports inside circular dependency[0] (node:9916) Warning: Accessing non-existent property 'remove' of module exports inside circular dependency[0] (node:9916) Warning: Accessing non-existent property 'updateOne' of module exports inside circular dependency[0] MongoDB Connected...[1] [HPM] Proxy created: / -> http://localhost:5000[1] i 「wds」: Project is running at http://192.168.123.163/[1] i 「wds」: webpack output is served from[1] i 「wds」: Content not from webpack is served from C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\public[1] i 「wds」: 404s will fallback to /[1] Starting the development server...[1][1] Error: error:0308010C:digital envelope routines::unsupported[1] at new Hash (node:internal/crypto/hash:71:19)[1] at Object.createHash (node:crypto:133:10)[1] at module.exports (C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\util\createHash.js:135:53)[1] at NormalModule._initBuildHash (C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\NormalModule.js:417:16) [1] at handleParseError (C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\NormalModule.js:471:10)[1] at C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\NormalModule.js:503:5[1] at C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\NormalModule.js:358:12[1] at C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\loader-runner\lib\LoaderRunner.js:373:3[1] at iterateNormalLoaders (C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\loader-runner\lib\LoaderRunner.js:214:10) [1] at iterateNormalLoaders (C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\loader-runner\lib\LoaderRunner.js:221:10) [1] C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\react-scripts\scripts\start.js:19[1] throw err;[1] ^[1][1] Error: error:0308010C:digital envelope routines::unsupported[1] at new Hash (node:internal/crypto/hash:71:19)[1] at Object.createHash (node:crypto:133:10)[1] at module.exports (C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\util\createHash.js:135:53)[1] at NormalModule._initBuildHash (C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\NormalModule.js:417:16) [1] at C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\NormalModule.js:452:10[1] at C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\webpack\lib\NormalModule.js:323:13[1] at C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\loader-runner\lib\LoaderRunner.js:367:11[1] at C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\loader-runner\lib\LoaderRunner.js:233:18[1] at context.callback (C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\loader-runner\lib\LoaderRunner.js:111:13) [1] at C:\Users\82105\Downloads\boilerplate-mern-stack-master\client\node_modules\babel-loader\lib\index.js:59:103 {[1] opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],[1] library: 'digital envelope routines',[1] reason: 'unsupported',[1] code: 'ERR_OSSL_EVP_UNSUPPORTED'[1] }
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
답글이 달리지않고 디비에도 저장되지않으며 새로고침이 됩니다.
안녕하세요. 좋은 강의 해주셔서 감사합니다. 다름이 아니라 따라 공부하는중에 기능이 제대로 작동하지않아 글 남깁니다.댓글은 디비에 잘 저장되고 아무 문제없지만 답글을 달면 새로고침이 되며 디비에도 저장이 안됩니다. 콘솔창과 네트워크 아무런 오류가 뜨지않습니다. 계속 봤지만 어디가 문제인지 감이 잡히지않아 질문 남깁니다.감사합니다. 깃허브 주소입니다.https://github.com/youngjae0411/123
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
useState 자동 생성
강의 영상을 보면 useState 입력 시 자동으로 전체 코드가 생성되는것을 볼 수 있는데, 이 기능은 어떻게 사용하는건가요?,,,,
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
TypeError: Cannot read properties of undefined (reading 'format')
video.jsrouter.post("/thumbnail", (req, res) => { let filePath = "" let fileDuration = "" ffmpeg.ffprobe(req.body.url, function (err, metadata) { console.dir(metadata); console.log(metadata.format.duration); fileDuration = metadata.format.duration }); ffmpeg(req.body.url) .on('filenames', function(filenames) { console.log('Will generate ' + filenames.join(', ')) console.log(filenames) filePath = "uploads/thumbnails/" + filenames[0] }) .on('end', function () { console.log('Screenshots taken'); return res.json({ success: true, url: filePath, fileDuration: fileDuration }); }) .on('error', function(err) { console.error(err); return res.json({ success: false, err }); }) .screenshots({ count: 3, folder: 'uploads/thumbnails', size: '320×240', filename: 'thumbnail-%b.png' }) });videouploadpage.jsconst onDrop =(files) => { let formData = new FormData; const config = { header: {'content-type': 'multipart/form-data'} } formData.append("file", files[0]) Axios.post('/api/Video/uploadfiles', formData, config) .then(response => { if(response.data.success) { console.log(response.data) let variable = { url: response.data.url, fileName: response.data.fileName } Axios.post('/api/video/thumbnail', variable) .then(response => { if(response.data.success) { console.log(response.data) } else { alert('썸네일 생성에 실패했습니다.') } }) } else{ alert('비디오 업로드에 실패했습니다.') } }) }콘솔 에러POST http://localhost:3000/api/video/thumbnail 500 (Internal Server Error)터미널 에러TypeError: Cannot read properties of undefined (reading 'format') 5강까지는 잘 작동했는데6강 들어와서 영상은 저장이 되는데 썸네일 생성이 안돼요ㅠㅠffmpeg 설치하고 환경변수 등록했고fluent-ffmpeg도 install 하고재부팅도 해봤는데 안돼요ㅠㅠ
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
userData undefined / state에 user.userData가 없습니다.
비디오 업로드 시 해당 에러가 발생합니다. state에 user.userData가 없어서 발생하는 것 같은데 어떻게 하면 state에 user.userData가 생성될까요?> 제 github 주소는 https://github.com/kimsiyeon828/bolier-plate-ko 입니다.
- 미해결따라하며 배우는 노드, 리액트 시리즈 - 유튜브 사이트 만들기
antd Input background color 변경
LoginPage의 Email, Password Input 상자의 Background Color를 하늘색으로 어떻게 바꾸는지 잘 모르겠습니다. 구글링해서 뒤져봐도. 이런식으로만 됩니다 ㅠㅠ