docker-node
docker-node copied to clipboard
nodejs
20.3.1 it does freeze at `Building for production...` for Vue project
Environment
- Platform: tested on several Linux systems
- Docker Version: 24.0.2
- Node.js Version: 20.3.1
- Image Tag: latest and 20-alpine
Expected Behavior
it should build a Vue project
Current Behavior
freezes at Building for production...
output:
#11 [build-stage 5/5] RUN npm run build --verbose
#11 0.440 npm verb cli /usr/local/bin/node /usr/local/bin/npm
#11 0.440 npm info using [email protected]
#11 0.440 npm info using [email protected]
#11 0.440 npm verb title npm run build
#11 0.440 npm verb argv "run" "build" "--loglevel" "verbose"
#11 0.441 npm verb logfile logs-max:10 dir:/root/.npm/_logs/2023-07-01T01_08_20_740Z-
#11 0.445 npm verb logfile /root/.npm/_logs/2023-07-01T01_08_20_740Z-debug-0.log
#11 0.453
#11 0.453 > [email protected] build
#11 0.453 > vue-cli-service build
#11 0.453
#11 0.685 All browser targets in the browserslist configuration have supported ES module.
#11 0.685 Therefore we don't build two separate bundles for differential loading.
#11 0.685
#11 0.694
#11 0.694 - Building for production...
Possible Solution
with Alpine:latest it works as expected
new Dockerfile:
# Stage 1: Build the Vue.js application
FROM alpine:latest AS build-stage
WORKDIR /app
COPY package*.json ./
RUN apk update && apk upgrade --no-cache && apk add nodejs-current npm
RUN npm install
COPY . .
RUN npm run build
output:
#13 [build-stage 7/7] RUN npm run build --verbose
#13 0.466 npm verb cli /usr/bin/node /usr/bin/npm
#13 0.466 npm info using [email protected]
#13 0.466 npm info using [email protected]
#13 0.467 npm verb title npm run build
#13 0.467 npm verb argv "run" "build" "--loglevel" "verbose"
#13 0.467 npm verb logfile logs-max:10 dir:/root/.npm/_logs/2023-07-01T01_04_25_848Z-
#13 0.472 npm verb logfile /root/.npm/_logs/2023-07-01T01_04_25_848Z-debug-0.log
#13 0.480
#13 0.480 > [email protected] build
#13 0.480 > vue-cli-service build
#13 0.480
#13 0.778 All browser targets in the browserslist configuration have supported ES module.
#13 0.778 Therefore we don't build two separate bundles for differential loading.
#13 0.778
#13 0.789
#13 0.789 - Building for production...
#13 6.074 DONE Compiled successfully in 4562ms1:04:31 AM
#13 6.074
#13 6.090 File Size Gzipped
#13 6.090
#13 6.090 dist/js/chunk-vendors.9294e7f2.js 101.96 KiB 40.33 KiB
#13 6.090 dist/js/app.1c2219c6.js 31.91 KiB 10.83 KiB
#13 6.090 dist/workbox-db5fc017.js 14.11 KiB 4.93 KiB
#13 6.090 dist/service-worker.js 1.99 KiB 1.15 KiB
#13 6.090 dist/css/app.f170b08c.css 7.32 KiB 1.99 KiB
#13 6.090
#13 6.090 Images and other types of assets omitted.
#13 6.090 Build at: 2023-07-01T01:04:31.481Z - Hash: 3c576e1fd7e206a7 - Time: 4562ms
#13 6.090
#13 6.090 DONE Build complete. The dist directory is ready to be deployed.
#13 6.090 INFO Check out deployment instructions at https://cli.vuejs.org/guide/deployment.html
#13 6.090
#13 6.111 npm verb exit 0
#13 6.111 npm info ok
#13 DONE 6.2s
Steps to Reproduce
Original Dockerfile:
FROM node:latest AS build-stage
WORKDIR /app
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
package.json:
{
"name": "mocha",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"[core-js](https://npmjs.com/package/core-js)": "[^3.8.3](https://npmjs.com/package/core-js)",
"[register-service-worker](https://npmjs.com/package/register-service-worker)": "[^1.7.2](https://npmjs.com/package/register-service-worker)",
"[vue](https://npmjs.com/package/vue)": "[^3.2.13](https://npmjs.com/package/vue)"
},
"devDependencies": {
"[@babel/core](https://npmjs.com/package/@babel/core)": "[^7.12.16](https://npmjs.com/package/@babel/core)",
"[@babel/eslint-parser](https://npmjs.com/package/@babel/eslint-parser)": "[^7.12.16](https://npmjs.com/package/@babel/eslint-parser)",
"[@vue/cli-plugin-babel](https://npmjs.com/package/@vue/cli-plugin-babel)": "[~5.0.0](https://npmjs.com/package/@vue/cli-plugin-babel)",
"[@vue/cli-plugin-eslint](https://npmjs.com/package/@vue/cli-plugin-eslint)": "[~5.0.0](https://npmjs.com/package/@vue/cli-plugin-eslint)",
"[@vue/cli-plugin-pwa](https://npmjs.com/package/@vue/cli-plugin-pwa)": "[~5.0.0](https://npmjs.com/package/@vue/cli-plugin-pwa)",
"[@vue/cli-service](https://npmjs.com/package/@vue/cli-service)": "[~5.0.0](https://npmjs.com/package/@vue/cli-service)",
"[eslint](https://npmjs.com/package/eslint)": "[^7.32.0](https://npmjs.com/package/eslint)",
"[eslint-plugin-vue](https://npmjs.com/package/eslint-plugin-vue)": "[^8.0.3](https://npmjs.com/package/eslint-plugin-vue)"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/vue3-essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "@babel/eslint-parser"
},
"rules": {}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead",
"not ie 11"
]
}
Additional Information
It also works with FROM node:19
