node.js - Rollup không phát sinh build trong docker-compose

Tôi đang xây dựng một ứng dụng react và tôi đang cố gắng để nó chạy thông qua một công thức docker-compose. Tôi đã làm cho nó hoạt động với

docker container run -p 3000:3000 --name node --rm -v "$PWD:/app" --init --workdir /app --entrypoint npm -it node:latest start

và quyết định chuyển nó thành công thức vì tôi sẽ thêm nhiều dịch vụ hơn trong tương lai. Tuy nhiên, tôi không thể khiến rollup tạo ra một gói. Đây là package.json của tôi và

package.json

{
  "name": "app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "rollup -c rollup.config.ts --configPlugin typescript -w"
  },
  "devDependencies": {
    "@babel/preset-react": "7.16.7",
    "@rollup/plugin-babel": "5.3.0",
    "@rollup/plugin-commonjs": "21.0.1",
    "@rollup/plugin-node-resolve": "13.1.3",
    "@rollup/plugin-replace": "3.0.1",
    "@rollup/plugin-typescript": "8.3.0",
    "@types/node": "17.0.13",
    "@types/react": "17.0.38",
    "@types/react-dom": "17.0.11",
    "rollup": "2.66.1",
    "rollup-plugin-livereload": "2.0.5",
    "rollup-plugin-serve": "1.1.0",
    "typescript": "4.5.5"
  },
  "dependencies": {
    "@emotion/react": "11.7.1",
    "@emotion/styled": "11.6.0",
    "@mui/material": "5.3.1",
    "react": "17.0.2",
    "react-dom": "17.0.2"
  }
}

docker-compose.yml

version: '3'

services:
  frontend:
    image: node:latest
    working_dir: /app
    user: 'node'
    ports: 
      - '3000:3000'
    volumes:
      - .:/app
    entrypoint: "npm run start"

cấu hình.rollup.ts

import babel from '@rollup/plugin-babel';
import commonjs from '@rollup/plugin-commonjs';
import { nodeResolve } from '@rollup/plugin-node-resolve';
import replace from '@rollup/plugin-replace';
import livereload from 'rollup-plugin-livereload';
import serve from 'rollup-plugin-serve';
import typescript from '@rollup/plugin-typescript';
import path from 'path';

export default {
    input: path.join(__dirname, 'src', 'index.tsx'),
    output: {
        file: path.join(__dirname, 'dist', 'bundle.js'),
        format: "iife",
        sourcemap: true
    },
    watch: {
        clearScreen: false
    },
    plugins: [
        typescript(),
        nodeResolve({ extensions: ['.js'] }),
        replace({ 
            preventAssignment: true,
            'process.env.NODE_ENV': JSON.stringify('development')
        }),
        babel({ presets: ['@babel/preset-react']}),
        commonjs(),
        serve({
            open: true,
            verbose: true,
            contentBase: ['', 'src'],
            host: '0.0.0.0',
            port: 3001
        }),
        livereload({ watch: 'dist' })
    ]
}

Chạy docker-compose up in ra stdout như sau. Tôi không hiểu tại sao nó lại treo ở đó. Tôi đã thử chạy npm start bên trong container và nó hoạt động bình thường và tạo ra một bundle, nhưng chạy qua docker-compose thì thất bại.

WARNING: The Docker Engine you're using is running in swarm mode.

Compose does not use swarm mode to deploy services to multiple nodes in a swarm. All containers will be scheduled on the current node.

To deploy your application across the swarm, use `docker stack deploy`.

Creating network "app_1" with the default driver
Creating app_1 ... done
Attaching to app_1
frontend_1  | 
frontend_1  | > [email  start
frontend_1  | > rollup -c rollup.config.ts --configPlugin typescript -w
frontend_1  | 
frontend_1  | loaded rollup.config.ts with warnings
frontend_1  | (!) Plugin typescript: @rollup/plugin-typescript TS7016: Could not find a declaration file for module 'rollup-plugin-serve'. '/app/node_modules/rollup-plugin-serve/dist/index.cjs.js' implicitly has an 'any' type.
frontend_1  |   Try `npm i --save-dev @types/rollup-plugin-serve` if it exists or add a new declaration (.d.ts) file containing `declare module 'rollup-plugin-serve';`
frontend_1  | rollup.config.ts: (6:19)
frontend_1  | 
frontend_1  | 6 import serve from 'rollup-plugin-serve';
frontend_1  |                     ~~~~~~~~~~~~~~~~~~~~~
frontend_1  | 
frontend_1  | rollup v2.66.1
frontend_1  | bundles /app/src/index.tsx → dist/bundle.js...
frontend_1  | babelHelpers: 'bundled' option was used by default. It is recommended to configure this option explicitly, read more here: https://github.com/rollup/plugins/tree/master/packages/babel#babelhelpers
frontend_1  | [BABEL] Note: The code generator has deoptimised the styling of /app/node_modules/react-dom/cjs/react-dom.development.js as it exceeds the max of 500KB.

Câu trả lời #1

Tôi đã gặp vấn đề tương tự, nhưng tôi không thể hứa rằng đây là chính xác giống nhau.

Sau hơn một giờ sửa lỗi tuyệt vọng, tôi đã phát hiện ra rằng trong trường hợp của mình, vấn đề mấu chốt là phân bổ terminal. Tôi đã làm nó hoạt động bằng cách thêm:

services:
  frontend:
    tty: true

Câu trả lời #2

Thay đổi entrypoint docker-compose của bạn thành

services:
  frontend:
    # ...
    entrypoint: bash -c "npm run start"

hoặc entrypoint: ["npm", "run", "start"]