Docker & Heroku

freekiller

Neu angemeldet
Registriert
17 Nov. 2015
Beiträge
43
Ort
Schweiz
Hallo zusammen

Ich möchte eine Applikation "dockerzieren" und in die Cloud deployen sprich auf Heroku. Bis dato habe ich dies noch nie gemacht und komme an meine Grenzen, da ich nicht weiss was ich beachten muss und wie ich die Fehler beheben kann.
Die Applikation kommt mit Node.js & dem Framework React.js daher.

Was habe ich bis anhin gemacht?
Docker:
-Folgendes Dockerfile erstellt:
[src=javascript]
FROM node:10
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
RUN npm audit fix
COPY . .
EXPOSE 8080
CMD [ "npm", "start" ]
[/src]
-Ein Docker ignore File erstellt und die Node Module ausgeschlossen
-Docker Desktop auf Windows installiert
-Folgende Befehle ausgeführt:
[src=javascript]
docker build -t <Mein Benutzername>/app //Dockerfile erstellen
docker images //Dockerimages anzeigen
docker run -p 49160:8080 -d <Mein Benutzername>/app //Image ausführen
docker ps //Container ID abrufen
docker logs <ContainerID> //Fehlerlog abrufen
[/src]

Leider kann das Image nicht ausgeführt werden und endet im Fehlercode:
[src=javascript]
name@1.1.0 start /usr/src/app
> concurrently --kill-others "webpack-dev-server --mode development --inline --progress" "cd backend && node server.js"

[1] internal/modules/cjs/loader.js:638
[1] throw err;
[1] ^
[1]
[1] Error: Cannot find module '../models/CustomDates'
[1] at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
[1] at Function.Module._load (internal/modules/cjs/loader.js:562:25)
[1] at Module.require (internal/modules/cjs/loader.js:690:17)
[1] at require (internal/modules/cjs/helpers.js:25:18)
[1] at Object.<anonymous> (/usr/src/app/backend/controller/CustomDates.js:2:19)
[1] at Module._compile (internal/modules/cjs/loader.js:776:30)
[1] at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
[1] at Module.load (internal/modules/cjs/loader.js:653:32)
[1] at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
[1] at Function.Module._load (internal/modules/cjs/loader.js:585:3)
[1] at Module.require (internal/modules/cjs/loader.js:690:17)
[1] at require (internal/modules/cjs/helpers.js:25:18)
[1] at Object.<anonymous> (/usr/src/app/backend/routes/CustomDates.js:3:19)
[1] at Module._compile (internal/modules/cjs/loader.js:776:30)
[1] at Object.Module._extensions..js (internal/modules/cjs/loader.js:787:10)
[1] at Module.load (internal/modules/cjs/loader.js:653:32)
[1] cd backend && node server.js exited with code 1
--> Sending SIGTERM to other processes..
[0] webpack-dev-server --mode development --inline --progress exited with code SIGTERM
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! name@1.1.0 start: `concurrently --kill-others "webpack-dev-server --mode development --inline --progress" "cd backend && node server.js"`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the verwaltung@1.0.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
[/src]

"Cannot find module ..." Finde ich komisch, da das File grundsätzlich existiert und auch dort zu finden ist.

###
Heroku
###
Nun habe ich versucht es ohne Docker auf Heroku zu deployen - dort kann die Applikation ebenfalls nicht ausgeführt werden.
--> Webpack konnte nicht gefunden werden

###
Lokal kann die Applikation ohne Probleme ausgeführt werden. Ich vermute es könnte an verwendeten Modulen liegen. Ich bin mir aber überhaupt nicht sicher wie ich vorgehen soll, deshalb erhoffe ich mir jemanden zu finden welcher sich mit Docker auskennt.

Vielleicht hilft es wenn ich mal das Package.json poste:
[src=javascript]
{
"name": "name",
"version": "1.1.0",
"description": "Name",
"scripts": {
"start": "concurrently --kill-others \"webpack-dev-server --mode development --inline --progress\" \"cd backend && node server.js\"",
"build": "webpack --mode production"
},
"keywords": [
"reactjs"
],
"author": "Name",
"license": "ISP",
"devDependencies": {
"babel-core": "^6.26.0",
"babel-eslint": "^7.2.3",
"babel-loader": "^7.1.4",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-2": "^6.24.1",
"clean-webpack-plugin": "^0.1.19",
"concurrently": "^4.1.0",
"css-loader": "^0.28.11",
"eslint": "^4.19.1",
"eslint-config-react-app": "^2.1.0",
"eslint-plugin-flowtype": "^2.47.1",
"eslint-plugin-import": "^2.12.0",
"eslint-plugin-jsx-a11y": "^5.1.1",
"eslint-plugin-react": "^7.8.2",
"extract-text-webpack-plugin": "^3.0.2",
"file-loader": "^1.1.11",
"friendly-errors-webpack-plugin": "^1.7.0",
"html-loader": "^0.5.5",
"html-webpack-plugin": "^3.2.0",
"mini-css-extract-plugin": "^0.4.0",
"node-sass": "^4.12.0",
"react": "^16.5.2",
"react-dom": "^16.5.2",
"sass-loader": "^6.0.7",
"uglifyjs-webpack-plugin": "^1.2.5",
"url-loader": "^1.0.1",
"webpack": "4.5.0",
"webpack-bundle-analyzer": "2.11.1",
"webpack-cli": "2.0.14",
"webpack-dev-server": "^3.2.1"
},
"dependencies": {
"@material-ui/core": "^3.9.2",
"@material-ui/icons": "^1.1.1",
"auth0-js": "^9.10.0",
"autosuggest-highlight": "3.1.1",
"axios": "^0.19.0",
"babel-polyfill": "^6.26.0",
"body-parser": "^1.19.0",
"chart.js": "^2.7.3",
"classnames": "2.2.6",
"concurrently": "^4.0.1",
"cors": "^2.8.5",
"downshift": "^3.2.2",
"draft-js": "0.10.5",
"express": "^4.16.4",
"firebase": "^6.1.0",
"globalize": "^0.1.1",
"google-map-react": "^1.1.2",
"hls.js": "^0.12.2",
"instantsearch.css": "^7.1.0",
"jquery": "^3.4.1",
"leaflet": "^1.4.0",
"material-ui-pickers": "1.0.0-rc.9",
"mdbreact": "^4.13.0",
"moment": "^2.24.0",
"mongodb": "^2.2.33",
"mongoose": "^5.5.7",
"morgan": "^1.9.1",
"mui-datatables": "2.0.0-beta-32",
"pdfmake": "^0.1.56",
"pusher": "^2.2.0",
"rc-queue-anim": "^1.6.10",
"react": "^16.8.6",
"react-addons-update": "15.6.2",
"react-autosuggest": "^9.4.3",
"react-beautiful-dnd": "^10.0.3",
"react-big-calendar": "^0.19.0",
"react-bootstrap-sweetalert": "^4.4.1",
"react-chartjs-2": "^2.7.4",
"react-content-loader": "^3.4.2",
"react-countup": "^4.0.0",
"react-credit-cards": "^0.7.0",
"react-cropper": "^1.0.1",
"react-custom-scrollbars": "^4.2.1",
"react-d3-speedometer": "^0.4.2",
"react-dnd": "^7.0.2",
"react-dnd-html5-backend": "^7.0.2",
"react-dom": "^16.8.6",
"react-draft-wysiwyg": "^1.13.1",
"react-dragula": "1.1.17",
"react-dropdown-select": "^3.0.0",
"react-dropzone-component": "^3.2.0",
"react-helmet": "^5.2.0",
"react-hot-loader": "^4.6.5",
"react-instantsearch": "^5.3.2",
"react-intl": "^2.8.0",
"react-joyride": "^1.11.4",
"react-jvectormap": "0.0.12",
"react-leaflet": "^2.2.0",
"react-loadable": "^5.5.0",
"react-moment": "^0.9.2",
"react-notifications": "^1.4.3",
"react-number-format": "^4.0.6",
"react-quill": "^1.3.3",
"react-redux": "^6.0.0",
"react-router-dom": "^4.3.1",
"react-scripts": "3.0.1",
"react-select": "^2.3.0",
"react-sidebar": "^3.0.2",
"react-slick": "^0.23.2",
"react-star-rating-component": "^1.4.1",
"react-swipeable-views": "^0.13.1",
"react-text-mask": "^5.4.3",
"react-toggle-switch": "^3.0.4",
"react-tooltip": "^3.9.2",
"react-twitter-widgets": "^1.7.1",
"reactstrap": "^7.1.0",
"recharts": "^1.4.2",
"redux": "^4.0.1",
"redux-saga": "^1.0.1",
"redux-thunk": "^2.3.0",
"screenfull": "^4.0.0",
"slick-carousel": "^1.8.1",
"socket.io": "^2.2.0",
"socket.io-client": "^2.2.0",
"uniqid": "^5.0.3",
"video-react": "^0.13.2",
"weather-icons": "^1.3.2"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"proxy": "http://localhost:3001"
}

[/src]

Besten Dank für jede Hilfe :)
 
Hab selber nur Grundlagenkenntnisse, aber bei den beiden Copy Befehlen scheinst du mir zweimal den aktuellen Standort der Dateien zu verwenden, also gar nichts zu kopieren.
Hast du mal geschaut, ob deine packages.json tatsächlich kopiert werden und npm install auch das tut was es soll?
 
  • Thread Starter Thread Starter
  • #3
Besten Dank für die Antwort. Ja die Package.json wird kopiert, npm install & npm audit fix wird ebenfalls durchlaufen. Beim Start happerts jedoch leider.
 
"models/CustomDates" klingt wie selbst geschriebener Code. Das ist nicht aus einem Node_Module, oder?


Deine Dockerfile überrascht mich etwas:
[src=javascript]
WORKDIR /usr/src/app
COPY package*.json ./
COPY . .[/src]

und dann per Dockerignore alles ausschließen, was nicht kopiert werden soll?

Was steht in der dockerignore genau drin? Eventuell schließt die ja das "models" Verzeichnis aus.
 
  • Thread Starter Thread Starter
  • #5
Richtig, das ist nicht in Node_Modules drin.
Beim Dockerfile ist das zweite COPY . . --> Bundle app source

.dockerignore:
node_modules
npm-debug.log

Der Node_Modules Ordner wird ja nicht gecacht - deshalb soll es normal installiert & gecacht werden und nicht direkt mit gepackt.
Weiteres wird nicht ausgeschlossen.

###
Ich konnte es beheben. Ich habe das Webpack nicht mehr im Dev Mode sondern im Build Mode in Docker gepackt und npm install / npm audit fix neu ausgeführt
 
Zuletzt bearbeitet:
Bitte daran denken den Container wie einen Server zu pflegen, das heißt libs, Anwendungen, Frameworks aktuell halten und Rechte durchdenken
 
Zurück
Oben