So I have spent many hours following a tutorial and working on a MERN stack social media application. I was unable to compile the app, so I went back through the tutorial and made sure that files were matching the files on the tutorials repo files.
I even reverted my addition, which was an instant messaging feature made with socketio. But I went back to before that feature, and decided to stick to not implementing the socketio for many reasons.
So I basically have a react-app and server that work 100% when ran from Visual Studio Code.
Can someone please explain what I am doing wrong, and or what I need to do differently.
The basic information I think is important;
-My client is ran via yarn start
-My server is ran via npm start,
-Both function properly when started in Visual Studio Code, connecting to MongoDB for my database.
-I created this locally, and then used Github Desktop to import the files as a repository.
-I connected Github to Netlify and created a website importing that repo. In the import I specified /client as the deploy path.
-On my build commands I have tried, "yarn start", "yarn run build", and "CI=false yarn start".
-In the environment I added YARN_VERSION 1.22.10 to fix the initial error I got when trying.
Link To My GitHub Repo:
https://github.com/VictorMonk/VM-social-media-app
Error code
2:02:15 PM: Waiting for other deploys from your team to complete. Check the queue: https://app.netlify.com/teams/victormonk/builds
2:02:31 PM: Build ready to start
2:02:33 PM: build-image version: d7b3dbfb0846505993c9a131894d1858074c90b4 (focal)
2:02:33 PM: build-image tag: v4.10.1
2:02:33 PM: buildbot version: 2a8b421219da5ccbdc68429ef8a83ca0b63d4f78
2:02:33 PM: Building without cache
2:02:33 PM: Starting to prepare the repo for build
2:02:33 PM: No cached dependencies found. Cloning fresh repo
2:02:33 PM: git clone https://github.com/VictorMonk/VM-social-media-app
2:02:34 PM: Preparing Git Reference refs/heads/main
2:02:34 PM: Parsing package.json dependencies
2:02:34 PM: Different publish path detected, going to use the one specified in the Netlify configuration file: 'client' versus '' in the Netlify UI
2:02:35 PM: Starting build script
2:02:35 PM: Installing dependencies
2:02:35 PM: Python version set to 2.7
2:02:35 PM: v16.16.0 is already installed.
2:02:35 PM: Now using node v16.16.0 (npm v8.11.0)
2:02:35 PM: Started restoring cached build plugins
2:02:35 PM: Finished restoring cached build plugins
2:02:35 PM: Attempting ruby version 2.7.2, read from environment
2:02:36 PM: Using ruby version 2.7.2
2:02:36 PM: Using PHP version 8.0
2:02:36 PM: Started restoring cached yarn cache
2:02:36 PM: Finished restoring cached yarn cache
2:02:37 PM: No yarn workspaces detected
2:02:37 PM: Started restoring cached node modules
2:02:37 PM: Finished restoring cached node modules
2:02:37 PM: Installing NPM modules using Yarn version 1.22.10
2:02:37 PM: npm WARN config tmp This setting is no longer used. npm stores temporary files in a special
2:02:37 PM: npm WARN config location in the cache, and they are managed by
2:02:37 PM: npm WARN config [`cacache`](http://npm.im/cacache).
2:02:37 PM: yarn install v1.22.10
2:02:37 PM: [1/4] Resolving packages...
2:02:37 PM: [2/4] Fetching packages...
2:02:50 PM: info fsevents@2.3.2: The platform "linux" is incompatible with this module.
2:02:50 PM: info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
2:02:50 PM: [3/4] Linking dependencies...
2:02:50 PM: warning " > @iconscout/react-unicons@1.1.6" has incorrect peer dependency "react@>=15.0.0 <17.0.0".
2:02:50 PM: warning "@mantine/core > @mantine/styles > @emotion/react > @emotion/babel-plugin@11.9.2" has unmet peer dependency "@babel/core@^7.0.0".
2:02:50 PM: warning "@mantine/core > @mantine/styles > @emotion/react > @emotion/babel-plugin > @babel/plugin-syntax-jsx@7.16.7" has unmet peer dependency "@babel/core@^7.0.0-0".
2:02:50 PM: warning " > @testing-library/user-event@13.5.0" has unmet peer dependency "@testing-library/dom@>=7.21.4".
2:02:50 PM: warning " > react-file-base64@1.0.3" has incorrect peer dependency "react@^15.0.2".
2:02:50 PM: warning "react-scripts > tailwindcss@3.0.23" has unmet peer dependency "autoprefixer@^10.0.2".
2:02:50 PM: warning "react-scripts > eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-syntax-flow@^7.14.5".
2:02:50 PM: warning "react-scripts > eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-transform-react-jsx@^7.14.9".
2:02:50 PM: warning "react-scripts > react-dev-utils > fork-ts-checker-webpack-plugin@6.5.0" has unmet peer dependency "typescript@>= 2.7".
2:02:50 PM: warning "react-scripts > eslint-config-react-app > @typescript-eslint/eslint-plugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
2:02:58 PM: [4/4] Building fresh packages...
2:02:59 PM: Done in 21.86s.
2:02:59 PM: NPM modules installed using Yarn
2:02:59 PM: Started restoring cached go cache
2:02:59 PM: Finished restoring cached go cache
2:02:59 PM: Installing Go version 1.17 (requested 1.17)
2:03:03 PM: unset GOOS;
2:03:03 PM: unset GOARCH;
2:03:03 PM: export GOROOT='/opt/buildhome/.gimme/versions/go1.17.linux.amd64';
2:03:03 PM: export PATH="/opt/buildhome/.gimme/versions/go1.17.linux.amd64/bin:${PATH}";
2:03:03 PM: go version >&2;
2:03:03 PM: export GIMME_ENV="/opt/buildhome/.gimme/env/go1.17.linux.amd64.env"
2:03:03 PM: go version go1.17 linux/amd64
2:03:03 PM: Installing missing commands
2:03:03 PM: Verify run directory
2:03:04 PM: ?
2:03:04 PM: ????????????????????????????????????????????????????????????????
2:03:04 PM: Netlify Build
2:03:04 PM: ????????????????????????????????????????????????????????????????
2:03:04 PM: ?
2:03:04 PM: ? Version
2:03:04 PM: @netlify/build 27.11.3
2:03:04 PM: ?
2:03:04 PM: ? Flags
2:03:04 PM: baseRelDir: true
2:03:04 PM: buildId: 62f938a7e46824236d16a3e2
2:03:04 PM: deployId: 62f938a7e46824236d16a3e4
2:03:04 PM: ?
2:03:04 PM: ? Current directory
2:03:04 PM: /opt/build/repo/client
2:03:04 PM: ?
2:03:04 PM: ? Config file
2:03:04 PM: No config file was defined: using default values.
2:03:04 PM: ?
2:03:04 PM: ? Context
2:03:04 PM: production
2:03:04 PM: ?
2:03:04 PM: ????????????????????????????????????????????????????????????????
2:03:04 PM: 1. Build command from Netlify app
2:03:04 PM: ????????????????????????????????????????????????????????????????
2:03:04 PM: ?
2:03:04 PM: $ CI=false yarn start
2:03:04 PM: yarn run v1.22.10
2:03:05 PM: $ react-scripts start
2:03:06 PM: (node:1448) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
2:03:06 PM: (Use `node --trace-deprecation ...` to show where the warning was created)
2:03:06 PM: (node:1448) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
2:03:06 PM: Starting the development server...
2:03:06 PM:
2:03:18 PM: Compiled with warnings.
2:03:18 PM:
2:03:18 PM: src/components/InfoCard/InfoCard.jsx
2:03:18 PM: Line 36:6: React Hook useEffect has a missing dependency: 'profileUserId'. Either include it or remove the dependency array react-hooks/exhaustive-deps
2:03:18 PM: src/components/Posts/Posts.jsx
2:03:18 PM: Line 15:6: React Hook useEffect has missing dependencies: 'dispatch' and 'user._id'. Either include them or remove the dependency array react-hooks/exhaustive-deps
2:03:18 PM: src/components/ProfileCard/ProfileCard.jsx
2:03:18 PM: Line 3:8: 'Cover' is defined but never used no-unused-vars
2:03:18 PM: Line 4:8: 'Profile' is defined but never used no-unused-vars
2:03:18 PM: src/components/ProfileModal/ProfileModal.jsx
2:03:18 PM: Line 18:11: 'user' is assigned a value but never used no-unused-vars
2:03:18 PM: src/components/User/User.jsx
2:03:18 PM: Line 5:9: 'publicFolder' is assigned a value but never used no-unused-vars
2:03:18 PM: src/index.js
2:03:18 PM: Line 5:10: 'PersistGate' is defined but never used no-unused-vars
2:03:18 PM: Search for the keywords to learn more about each warning.
2:03:18 PM: To ignore, add // eslint-disable-next-line to the line before.
2:03:18 PM: assets by path static/ 2.57 MiB
2:03:18 PM: asset static/js/bundle.js 2.53 MiB [emitted] (name: main) 1 related asset
2:03:18 PM: asset static/media/profileImg.e857f45860a47d11abdd.jpg 40.8 KiB [emitted] [immutable] [from: src/img/profileImg.jpg] (auxiliary name: main)
2:03:18 PM: asset index.html 1.89 KiB [emitted]
2:03:18 PM: asset asset-manifest.json 278 bytes [emitted]
2:03:18 PM: orphan modules 2.08 MiB [orphan] 1592 modules
2:03:18 PM: runtime modules 29.3 KiB 14 modules
2:03:18 PM: cacheable modules 2.04 MiB (javascript) 40.8 KiB (asset)
2:03:18 PM: modules by path ./node_modules/ 1.84 MiB 286 modules
2:03:18 PM: modules by path ./src/ 204 KiB (javascript) 40.8 KiB (asset)
2:03:18 PM: javascript modules 178 KiB 66 modules
2:03:18 PM: asset modules 25.4 KiB (javascript) 40.8 KiB (asset)
2:38:31 PM: Build exceeded maximum allowed runtime
2:38:32 PM: modules by path ./src/img/*.png 15.7 KiB ./src/img/logo.png 5.86 KiB [built] [code generated] ./src/img/comment.png 844 bytes [built] [code generated] ./src/img/home.png 4.11 KiB [built] [code generated] + 4 modules modules by path ./src/img/*.jpg 9.78 KiB (javascript) 40.8 KiB (asset) ./src/img/cover.jpg 9.74 KiB [built] [code generated] ./src/img/profileImg.jpg 42 bytes (javascript) 40.8 KiB (asset) [built] [code generated]WARNING in src/components/InfoCard/InfoCard.jsx Line 36:6: React Hook useEffect has a missing dependency: 'profileUserId'. Either include it or remove the dependency array react-hooks/exhaustive-depssrc/components/Posts/Posts.jsx Line 15:6: React Hook useEffect has missing dependencies: 'dispatch' and 'user._id'. Either include them or remove the dependency array react-hooks/exhaustive-depssrc/components/ProfileCard/ProfileCard.jsx Line 3:8: 'Cover' is defined but never used no-unused-vars Line 4:8: 'Profile' is defined but never used no-unused-varssrc/components/ProfileModal/ProfileModal.jsx Line 18:11: 'user' is assigned a value but never used no-unused-varssrc/components/User/User.jsx Line 5:9: 'publicFolder' is assigned a value but never used no-unused-varssrc/index.js Line 5:10: 'PersistGate' is defined but never used no-unused-varswebpack 5.70.0 compiled with 1 warning in 12024 msFailed to compile.
2:38:32 PM:
2:38:32 PM: Module not found: Error: Can't resolve '/opt/build/repo/client/node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js' in '/opt/build/repo/client'assets by chunk 41.1 KiB (name: main)
2:38:32 PM: asset static/js/bundle.js 40.7 KiB [emitted] (name: main) 1 related asset
2:38:32 PM: asset main.32252bafcc03b688f2e7.hot-update.js 358 bytes [emitted] [immutable] [hmr] (name: main) 1 related asset
2:38:32 PM: assets by path *.json 23 KiB
2:38:32 PM: asset main.32252bafcc03b688f2e7.hot-update.json 22.7 KiB [emitted] [immutable] [hmr]
2:38:32 PM: asset asset-manifest.json 315 bytes [emitted]
2:38:32 PM: asset index.html 2.66 KiB [emitted]
2:38:32 PM: Entrypoint main 41.1 KiB (38.8 KiB) = static/js/bundle.js 40.7 KiB main.32252bafcc03b688f2e7.hot-update.js 358 bytes 2 auxiliary assets
2:38:32 PM: runtime modules 27.1 KiB 9 modules
2:38:32 PM: WARNING in src/components/InfoCard/InfoCard.jsx
2:38:32 PM: Line 36:6: React Hook useEffect has a missing dependency: 'profileUserId'. Either include it or remove the dependency array react-hooks/exhaustive-deps
2:38:32 PM: src/components/Posts/Posts.jsx
2:38:32 PM: Line 15:6: React Hook useEffect has missing dependencies: 'dispatch' and 'user._id'. Either include them or remove the dependency array react-hooks/exhaustive-deps
2:38:32 PM: src/components/ProfileCard/ProfileCard.jsx
2:38:32 PM: Line 3:8: 'Cover' is defined but never used no-unused-vars
2:38:32 PM: Line 4:8: 'Profile' is defined but never used no-unused-vars
2:38:32 PM: src/components/ProfileModal/ProfileModal.jsx
2:38:32 PM: Line 18:11: 'user' is assigned a value but never used no-unused-vars
2:38:32 PM: src/components/User/User.jsx
2:38:32 PM: Line 5:9: 'publicFolder' is assigned a value but never used no-unused-vars
2:38:32 PM: src/index.js
2:38:32 PM: Line 5:10: 'PersistGate' is defined but never used no-unused-vars
2:38:32 PM: ERROR in Module not found: Error: Can't resolve '/opt/build/repo/client/node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js' in '/opt/build/repo/client'
2:38:32 PM: ERROR in Module not found: Error: Can't resolve '/opt/build/repo/client/node_modules/webpack-dev-server/client/index.js?protocol=ws%3A&hostname=0.0.0.0&port=3000&pathname=%2Fws&logging=none&reconnect=10' in '/opt/build/repo/client'
2:38:32 PM: ERROR in Module not found: Error: Can't resolve '/opt/build/repo/client/node_modules/webpack/hot/dev-server.js' in '/opt/build/repo/client'
2:38:32 PM: ERROR in main
2:38:32 PM: Module not found: Error: Can't resolve '/opt/build/repo/client/src/index.js' in '/opt/build/repo/client'
2:38:32 PM: ERROR in Error: Child compilation failed:
2:38:32 PM: Module not found: Error: Can't resolve '/opt/build/repo/client/node_modules/ht ml-webpack-plugin/lib/loader.js' in '/opt/build/repo/client' ModuleNotFoundError: Module not found: Error: Can't resolve '/opt/build/repo/c lient/node_modules/html-webpack-plugin/lib/loader.js' in '/opt/build/repo/clie nt' at /opt/build/repo/client/node_modules/webpack/lib/Compilation.js:2015:28
2:38:32 PM: at /opt/build/repo/client/node_modules/webpack/lib/NormalModuleFactory.js: 798:13
2:38:32 PM: at eval (eval at create (/opt/build/repo/client/node_modules/tapable/lib/H ookCodeFactory.js:33:10), <anonymous>:10:1)
2:38:32 PM: at /opt/build/repo/client/node_modules/webpack/lib/NormalModuleFactory.js: 270:22
2:38:32 PM: at eval (eval at create (/opt/build/repo/client/node_modules/tapable/lib/H ookCodeFactory.js:33:10), <anonymous>:9:1)
2:38:32 PM: at /opt/build/repo/client/node_modules/webpack/lib/NormalModuleFactory.js: 434:22
2:38:32 PM: at /opt/build/repo/client/node_modules/webpack/lib/NormalModuleFactory.js: 120:11
2:38:32 PM: at /opt/build/repo/client/node_modules/webpack/lib/NormalModuleFactory.js: 635:23
2:38:32 PM: at /opt/build/repo/client/node_modules/neo-async/async.js:2830:7
2:38:32 PM: at done (/opt/build/repo/client/node_modules/neo-async/async.js:2925:13)
2:38:32 PM: - Compilation.js:2015
2:38:32 PM: [client]/[webpack]/lib/Compilation.js:2015:28
2:38:32 PM: - NormalModuleFactory.js:798
2:38:32 PM: [client]/[webpack]/lib/NormalModuleFactory.js:798:13
2:38:32 PM: - NormalModuleFactory.js:270
2:38:32 PM: [client]/[webpack]/lib/NormalModuleFactory.js:270:22
2:38:32 PM: - NormalModuleFactory.js:434
2:38:32 PM: [client]/[webpack]/lib/NormalModuleFactory.js:434:22
2:38:32 PM: - NormalModuleFactory.js:120
2:38:32 PM: [client]/[webpack]/lib/NormalModuleFactory.js:120:11
2:38:32 PM: - NormalModuleFactory.js:635
2:38:32 PM: [client]/[webpack]/lib/NormalModuleFactory.js:635:23
2:38:32 PM: - async.js:2830
2:38:32 PM: [client]/[neo-async]/async.js:2830:7
2:38:32 PM: - async.js:2925 done
2:38:32 PM: [client]/[neo-async]/async.js:2925:13
2:38:32 PM: - child-compiler.js:169
2:38:32 PM: [client]/[html-webpack-plugin]/lib/child-compiler.js:169:18
2:38:32 PM: - Compiler.js:564
2:38:32 PM: [client]/[webpack]/lib/Compiler.js:564:11
2:38:32 PM: - Compiler.js:1183
2:38:32 PM: [client]/[webpack]/lib/Compiler.js:1183:17
2:38:32 PM: - Hook.js:18 Hook.CALL_ASYNC_DELEGATE [as _callAsync]
2:38:32 PM: [client]/[tapable]/lib/Hook.js:18:14
2:38:32 PM: - Compiler.js:1179
2:38:32 PM: [client]/[webpack]/lib/Compiler.js:1179:33
2:38:32 PM: - Compilation.js:2786 finalCallback
2:38:32 PM: [client]/[webpack]/lib/Compilation.js:2786:11
2:38:32 PM: - Compilation.js:3091
2:38:32 PM: [client]/[webpack]/lib/Compilation.js:3091:11
2:38:32 PM: - Hook.js:18 Hook.CALL_ASYNC_DELEGATE [as _callAsync]
2:38:32 PM: [client]/[tapable]/lib/Hook.js:18:14
2:38:32 PM:
2:38:32 PM: 1 ERROR in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)
2:38:32 PM: 4 errors have detailed information that is not shown.
2:38:32 PM: Use 'stats.errorDetails: true' resp. '--stats-error-details' to show it.
2:38:32 PM: webpack 5.70.0 compiled with 6 errors and 1 warning in 235 ms
Thanks in advanced. I really would like to get this up for presentation. It is my first React-App, but I have made php full stack websites in the past.
