Foundation-spa-react icon indicating copy to clipboard operation
Foundation-spa-react copied to clipboard

Errors when installing

Open AlexanderCarlstrom opened this issue 4 years ago • 4 comments

I followed all installation instructions and have all prerequisites installed and done. Still every time I try to install/run setup.cmd I get these errors. I tried it on two different computers with the same result

`Error: Cannot find module 'dotenv' Require stack:

  • C:\dev\FoundationTest\src\Spa.Frontend\node_modules@episerver\webpack\cjs\util\Config.js
  • C:\dev\FoundationTest\src\SpaFrontend\node_modules@episerver\webpack\cjs\util\CliArguments.js
  • C:\dev\FoundationTest\src\Spa.Frontend\node_modules@episerver\webpack\cjs\bin\epi-auth.js at Function.Module._resolveFilename (internal/modules/cjs/loader.js:889:15) at Function.Module._load (internal/modules/cjs/loader.js:745:27) at Module.require (internal/modules/cjs/loader.js:961:19) at require (internal/modules/cjs/helpers.js:92:18) at Object. (C:\dev\FoundationTest\src\Spa.Frontend\node_modules@episerver\webpack\cjs\util\Config.js:9:34) at Module._compile (internal/modules/cjs/loader.js:1072:14) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10) at Module.load (internal/modules/cjs/loader.js:937:32) at Function.Module._load (internal/modules/cjs/loader.js:778:12) at Module.require (internal/modules/cjs/loader.js:961:19) { code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\dev\FoundationTest\src\Spa.Frontend\node_modules\@episerver\webpack\cjs\util\Config.js', 'C:\dev\FoundationTest\src\Spa.Frontend\node_modules\@episerver\webpack\cjs\util\CliArguments.js', 'C:\dev\FoundationTest\src\Spa.Frontend\node_modules\@episerver\webpack\cjs\bin\epi-auth.js' ] }

[email protected] build:production C:\dev\FoundationTest\src\Spa.frontend npx epi-sync-models -e production && npx webpack --env EPI_ENV=production --env NODE_ENV=production && npx epi-sync-models -e development

internal/modules/cjs/loader.js:892 throw err; ^

Error: Cannot find module 'dotenv' Require stack:

  • C:\dev\FoundationTest\src\Spa.Frontend\node_modules@episerver\webpack\cjs\util\Config.js
  • C:\dev\FoundationTest\src\Spa.Frontend\node_modules@episerver\webpack\cjs\util\CliArguments.js
  • C:\dev\FoundationTest\src\Spa.Frontend\node_modules@episerver\webpack\cjs\bin\epi_sync_models.js at Function.Module._resolveFilename (internal/modules/cjs/loader.js:889:15) at Function.Module._load (internal/modules/cjs/loader.js:745:27) at Module.require (internal/modules/cjs/loader.js:961:19) at require (internal/modules/cjs/helpers.js:92:18) at Object. (C:\dev\FoundationTest\src\Spa.Frontend\node_modules@episerver\webpack\cjs\util\Config.js:9:34) at Module._compile (internal/modules/cjs/loader.js:1072:14) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1101:10) at Module.load (internal/modules/cjs/loader.js:937:32) at Function.Module._load (internal/modules/cjs/loader.js:778:12) at Module.require (internal/modules/cjs/loader.js:961:19) { code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\dev\FoundationTest\src\Spa.Frontend\node_modules\@episerver\webpack\cjs\util\Config.js', 'C:\dev\FoundationTest\src\Spa.Frontend\node_modules\@episerver\webpack\cjs\util\CliArguments.js', 'C:\dev\FoundationTest\src\Spa.Frontend\node_modules\@episerver\webpack\cjs\bin\epi_sync_models.js' ] } npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! [email protected] build:production: npx epi-sync-models -e production && npx webpack --env EPI_ENV=production --env NODE_ENV=production && npx epi-sync-models -e development npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the [email protected] build:production script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Alexander\AppData\Roaming\npm-cache_logs\2021-09-23T14_30_04_474Z-debug.log Run resetup.cmd to resetup solution

Press any key to continue . . . `

Any idea what might be causing this?

AlexanderCarlstrom avatar Sep 24 '21 09:09 AlexanderCarlstrom

Nope, but having solved my first issue (needing to set up SSH in GitHub) I get the same error. node -v v.14.15.1

If I figure it out I'll make a note of how here.

MarkMcDonald avatar Oct 01 '21 14:10 MarkMcDonald

Managed to solve the first issue by modifying the package.json in /src/Spa.Foundation/ to include dotenv:

{ "name": "foundation-spa-frontend", "version": "1.0.0", "description": "Frontend for Episerver Foundation CMS built using TypeScript & React", "private": true, "scripts": { "login": "npx epi-auth -e development", "sync-models": "npx epi-sync-models -e development", "test": "echo "Error: no test specified" && exit 1", "clean": "echo "Clean: not implemented" && exit 0", "start": "npx webpack serve --env EPI_ENV=development --config webpack.dev.config.js", "build": "npx webpack --env EPI_ENV=development --env NODE_ENV=development", "build:production": "npx epi-sync-models -e production && npx webpack --env EPI_ENV=production --env NODE_ENV=production && npx epi-sync-models -e development", "watch": "npx webpack --watch --progress --env EPI_ENV=development", "compile": "npx tsc --pretty --project ./tsconfig.json" }, "author": "Remko Jantzen", "license": "Apache-2.0", "dependencies": { "@episerver/foundation-settings": "file:lib/foundation-settings", "@episerver/spa-core": "github:episerver/foundation-lib-spa-core#semver:0.1.3", "@fullcalendar/daygrid": "^5.4.0", "@fullcalendar/list": "^5.4.0", "@fullcalendar/react": "^5.4.0", "@reduxjs/toolkit": "^1.5.0", "axios": "^0.21.0", "bootstrap": "^4.6.0", "core-js": "^3.8.3", "dotenv": "^10.0.0", "eventemitter3": "^4.0.7", "html-entities": "^2.0.6", "jquery": "^3.5.1", "leaflet": "^1.7.1", "lodash": "^4.17.19", "react": "^17.0.1", "react-dom": "^17.0.1", "react-helmet": "^6.0.0", "react-leaflet": "^3.1.0", "react-player": "^2.8.1", "react-redux": "^7.2.2", "react-router": "^5.2.0", "react-router-dom": "^5.2.0", "reactstrap": "^8.9.0", "uuid": "^8.3.2" }, "devDependencies": { "@episerver/webpack": "github:episerver/foundation-lib-spa-webpack#semver:0.1.5", "@fortawesome/fontawesome-free": "^5.15.2", "@types/bootstrap": "^4.6.0", "@types/jquery": "^3.5.5", "@types/leaflet": "^1.5.23", "@types/lodash": "^4.14.168", "@types/react": "^17.0.0", "@types/react-dom": "^17.0.0", "@types/react-helmet": "^6.1.0", "@types/react-redux": "^7.1.16", "@types/react-router": "^5.1.11", "@types/react-router-dom": "^5.1.7", "@types/uuid": "^8.3.0", "clean-webpack-plugin": "^3.0.0", "copy-webpack-plugin": "^9.0.0", "css-loader": "^5.0.1", "dotenv-expand": "^5.1.0", "esm": "^3.2.25", "file-loader": "^6.2.0", "filemanager-webpack-plugin": "^5.0.0", "html-webpack-plugin": "^5.1.0", "loader-utils": "^2.0.0", "mini-css-extract-plugin": "^1.3.4", "postcss": "^8.2.15", "postcss-loader": "^5.0.0", "precss": "^4.0.0", "resolve-url-loader": "^4.0.0", "sass": "^1.33.0", "sass-loader": "^11.1.1", "schema-utils": "^3.0.0", "source-map-loader": "^3.0.0", "style-loader": "^2.0.0", "terser-webpack-plugin": "^5.1.1", "ts-loader": "^9.1.1", "typescript": "^4.2.2", "webpack": "^5.17.0", "webpack-cli": "^4.4.0", "webpack-dev-server": "^3.11.2", "webpack-manifest-plugin": "^3.0.0", "webpack-merge": "^5.7.3", "webpack-node-externals": "^3.0.0", "xmlhttprequest": "^1.8.0", "yargs": "^17.0.1" } }

Now I get the issue:

  • SysRecycleBinData written to C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\src\Models\Content\SysRecycleBinData.ts
  • BlogItemPageData written to C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\src\Models\Content\BlogItemPageData.ts [webpack-cli] Failed to load 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\webpack.config.js' config [webpack-cli] Error: Cannot find module 'form-data' Require stack:
  • C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules@episerver\webpack\cjs\webpack-plugins\DeployToEpiserverPlugin.js
  • C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules@episerver\webpack\cjs\index.js
  • C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\webpack.frontend.config.js
  • C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\webpack.config.js
  • C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\webpack-cli\lib\webpack-cli.js
  • C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\webpack-cli\lib\bootstrap.js
  • C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\webpack-cli\bin\cli.js
  • C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\webpack\bin\webpack.js at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15) at Function.Module._load (internal/modules/cjs/loader.js:725:27) at Module.require (internal/modules/cjs/loader.js:952:19) at require (C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\v8-compile-cache\v8-compile-cache.js:159:20) at Object. (C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules@episerver\webpack\cjs\webpack-plugins\DeployToEpiserverPlugin.js:17:37) at Module._compile (C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\v8-compile-cache\v8-compile-cache.js:192:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10) at Module.load (internal/modules/cjs/loader.js:928:32) at Function.Module._load (internal/modules/cjs/loader.js:769:14) at Module.require (internal/modules/cjs/loader.js:952:19) { code: 'MODULE_NOT_FOUND', requireStack: [ 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\@episerver\webpack\cjs\webpack-plugins\DeployToEpiserverPlugin.js', 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\@episerver\webpack\cjs\index.js', 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\webpack.frontend.config.js', 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\webpack.config.js', 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\webpack-cli\lib\webpack-cli.js', 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\webpack-cli\lib\bootstrap.js', 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\webpack-cli\bin\cli.js', 'C:\Work\GitHub\Episerver\Foundation-spa-react\src\Spa.Frontend\node_modules\webpack\bin\webpack.js' ] } npm ERR! code ELIFECYCLE npm ERR! errno 2 npm ERR! [email protected] build:production: npx epi-sync-models -e production && npx webpack --env EPI_ENV=production --env NODE_ENV=production && npx epi-sync-models -e development npm ERR! Exit status 2 npm ERR! npm ERR! Failed at the [email protected] build:production script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\markp\AppData\Roaming\npm-cache_logs\2021-10-01T14_38_00_361Z-debug.log Run resetup.cmd to resetup solution Press any key to continue . . .

MarkMcDonald avatar Oct 01 '21 14:10 MarkMcDonald

Adding in "form-data": "^4.0.0" to the package.json in /src/Spa.Foundation/ seems to have resolved the problem.

See a site but with lots of issues that looked to be caused providing a public domain during set-up. Loads on http://foundation.local/ (public domain) but then has references in the generated code to http://foundation/ (app name) leading to broken images - even if I try run the whole site on a binding for http://foundation/ I then get CORS issues as its trying to load content on http://foundation.local/.

Going to rerun set-up without specifying a public domain to see if it improves things.

Updated package.json below:

{ "name": "foundation-spa-frontend", "version": "1.0.0", "description": "Frontend for Episerver Foundation CMS built using TypeScript & React", "private": true, "scripts": { "login": "npx epi-auth -e development", "sync-models": "npx epi-sync-models -e development", "test": "echo "Error: no test specified" && exit 1", "clean": "echo "Clean: not implemented" && exit 0", "start": "npx webpack serve --env EPI_ENV=development --config webpack.dev.config.js", "build": "npx webpack --env EPI_ENV=development --env NODE_ENV=development", "build:production": "npx epi-sync-models -e production && npx webpack --env EPI_ENV=production --env NODE_ENV=production && npx epi-sync-models -e development", "watch": "npx webpack --watch --progress --env EPI_ENV=development", "compile": "npx tsc --pretty --project ./tsconfig.json" }, "author": "Remko Jantzen", "license": "Apache-2.0", "dependencies": { "@episerver/foundation-settings": "file:lib/foundation-settings", "@episerver/spa-core": "github:episerver/foundation-lib-spa-core#semver:0.1.3", "@fullcalendar/daygrid": "^5.4.0", "@fullcalendar/list": "^5.4.0", "@fullcalendar/react": "^5.4.0", "@reduxjs/toolkit": "^1.5.0", "axios": "^0.21.0", "bootstrap": "^4.6.0", "core-js": "^3.8.3", "dotenv": "^10.0.0", "eventemitter3": "^4.0.7", "form-data": "^4.0.0", "html-entities": "^2.0.6", "jquery": "^3.5.1", "leaflet": "^1.7.1", "lodash": "^4.17.19", "react": "^17.0.1", "react-dom": "^17.0.1", "react-helmet": "^6.0.0", "react-leaflet": "^3.1.0", "react-player": "^2.8.1", "react-redux": "^7.2.2", "react-router": "^5.2.0", "react-router-dom": "^5.2.0", "reactstrap": "^8.9.0", "uuid": "^8.3.2" }, "devDependencies": { "@episerver/webpack": "github:episerver/foundation-lib-spa-webpack#semver:0.1.5", "@fortawesome/fontawesome-free": "^5.15.2", "@types/bootstrap": "^4.6.0", "@types/jquery": "^3.5.5", "@types/leaflet": "^1.5.23", "@types/lodash": "^4.14.168", "@types/react": "^17.0.0", "@types/react-dom": "^17.0.0", "@types/react-helmet": "^6.1.0", "@types/react-redux": "^7.1.16", "@types/react-router": "^5.1.11", "@types/react-router-dom": "^5.1.7", "@types/uuid": "^8.3.0", "clean-webpack-plugin": "^3.0.0", "copy-webpack-plugin": "^9.0.0", "css-loader": "^5.0.1", "dotenv-expand": "^5.1.0", "esm": "^3.2.25", "file-loader": "^6.2.0", "filemanager-webpack-plugin": "^5.0.0", "html-webpack-plugin": "^5.1.0", "loader-utils": "^2.0.0", "mini-css-extract-plugin": "^1.3.4", "postcss": "^8.2.15", "postcss-loader": "^5.0.0", "precss": "^4.0.0", "resolve-url-loader": "^4.0.0", "sass": "^1.33.0", "sass-loader": "^11.1.1", "schema-utils": "^3.0.0", "source-map-loader": "^3.0.0", "style-loader": "^2.0.0", "terser-webpack-plugin": "^5.1.1", "ts-loader": "^9.1.1", "typescript": "^4.2.2", "webpack": "^5.17.0", "webpack-cli": "^4.4.0", "webpack-dev-server": "^3.11.2", "webpack-manifest-plugin": "^3.0.0", "webpack-merge": "^5.7.3", "webpack-node-externals": "^3.0.0", "xmlhttprequest": "^1.8.0", "yargs": "^17.0.1" } }

MarkMcDonald avatar Oct 01 '21 15:10 MarkMcDonald

Thank you for the response. I did manage to solve it by adding dotenv and form-data to the package.json as you said. But I still get a lot of errors. I have moved on and will not be using this github repo. But thanks for the help.

AlexanderCarlstrom avatar Oct 14 '21 08:10 AlexanderCarlstrom