docker代码位于下方
FROM node:16.9.1-alpine as build
WORKDIR /app
# Copy required files/folders to docker directory
COPY package.json /app
COPY package-lock.json /app
COPY lerna.json /app
COPY yarn.lock /app
COPY babel.config.js /app
COPY shared /app/shared
COPY projects/tt-core /app/projects/tt-core
# Installing yarn dependicies and biuld the tt-core project
RUN yarn install --frozen-lockfile --non-interactive --production=false --ignore-scripts
RUN yarn build:tt-core
# run reactjs with nginx in production
FROM nginx:stable-alpine
COPY --from=build /app/projects/tt-core/build /usr/share/nginx/html
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx/nginx.conf /etc/nginx/conf.d
COPY ssl /etc/ssl/certs
EXPOSE 80
EXPOSE 443
CMD ["nginx", "-g", "daemon off;"]
我已经完成了azure DevOps管道构建。它为React Image Build显示的日志如下所述。生成运行时会显示警告。我试着把显示警告的日志放上去了。建筑中显示了近十万条警告线。
react-hooks/exhaustive-deps
2022-09-05T10:34:04.2510960Z Line 142:60: Expected '!==' and instead saw '!=' eqeqeq
2022-09-05T10:34:04.2629366Z Line 145:6: React Hook useEffect has a missing dependency: 'productList'. Either include it or remove the dependency array react-hooks/exhaustive-deps
2022-09-05T10:34:04.2632812Z Line 154:54: Expected to return a value in arrow function array-callback-return
2022-09-05T10:34:04.2637882Z Line 254:6: React Hook useEffect has missing dependencies: 'currentModalData.autoComplete', 'currentModalData.balance', 'currentModalData.bufferSize', 'currentModalData.cavity', 'currentModalData.cyclePerPack', 'currentModalData.description', 'currentModalData.erpWorkOrder', 'currentModalData.estimatedCompletion', 'currentModalData.fromTime', 'currentModalData.isPacking', 'currentModalData.jobProducts', 'currentModalData.operators', 'currentModalData.packingDeviceId', 'currentModalData.packingEquipmentId', 'currentModalData.plannedCompletion', 'currentModalData.plannedCycleTime', 'currentModalData.plannedStart', 'currentModalData.pulsesPerMeter', 'currentModalData.quantity', 'currentModalData.setupHours', 'currentModalData.state', 'currentModalData.tool', 'currentModalData.toolId', 'currentModalData.toolLocation', 'currentModalData.totalProduction', 'dispatch', 'form', 'isUpdate', and 'updatedProductList'. Either include them or remove the dependency array. You can also do a functional update 'setUpdatedProductList(u => ...)' if you only need 'updatedProductList' in the 'setUpdatedProductList' call react-hooks/exhaustive-deps
2022-09-05T10:34:04.2655472Z Line 257:57: Expected '!==' and instead saw '!=' eqeqeq
2022-09-05T10:34:04.2664779Z Line 261:6: React Hook useEffect has missing dependencies: 'CalculatedJobTiming', 'checkActiveMainenanceJob', and 'setJobTimingFields'. Either include them or remove the dependency array react-hooks/exhaustive-deps
2022-09-05T10:34:04.2672463Z Line 267:34: Expected '!==' and instead saw '!=' eqeqeq
2022-09-05T10:34:04.2684953Z Line 272:6: React Hook useEffect has a missing dependency: 'ActiveMaintenanceJobsList'. Either include it or remove the dependency array react-hooks/exhaustive-deps
2022-09-05T10:34:04.2688468Z Line 278:33: Expected '!==' and instead saw '!=' eqeqeq
2022-09-05T10:34:04.2691376Z Line 286:34: Expected to return a value at the end of arrow function array-callback-return
2022-09-05T10:34:04.2694805Z Line 293:6: React Hook useEffect has missing dependencies: 'ProductsToolDataList', 'currentModalData.cavity', 'form', and 'jobModalData.cavity'. Either include them or remove the dependency array. You can also replace multiple useState variables with useReducer if 'setStoredCavity' needs the current value of 'jobModalData.cavity' react-hooks/exhaustive-deps
2022-09-05T10:34:04.2698664Z Line 304:6: React Hook useEffect has missing dependencies: 'calculatePlannedDate' and 'form'. Either include them or remove the dependency array react-hooks/exhaustive-deps
2022-09-05T10:34:04.2701901Z Line 318:6: React Hook useEffect has a missing dependency: 'dispatch'. Either include it or remove the dependency array react-hooks/exhaustive-deps
2022-09-05T10:34:04.2704966Z Line 323:38: Expected to return a value in arrow function array-callback-return
2022-09-05T10:34:04.2708051Z Line 391:26: Expected to return a value in arrow function array-callback-return
2022-09-05T10:34:04.2711119Z Line 452:44: Expected to return a value in arrow function array-callback-return
2022-09-05T10:34:04.2714085Z Line 487:47: Expected to return a value in arrow function array-callback-return
2022-09-05T10:34:04.2719374Z Line 505:32: Expected to return a value in arrow function array-callback-return
2022-09-05T10:34:04.2722884Z Line 506:54: Expected to return a value in arrow function array-callback-return
2022-09-05T10:34:04.2726137Z Line 698:6: React Hook useEffect has missing dependencies: 'currentModalData.totalProduction', 'currentModalData.totalRejection', and 'isUpdate'. Either include them or remove the dependency array react-hooks/exhaustive-deps
2022-09-05T10:34:04.2729762Z Line 737:6: React Hook useEffect has missing dependencies: 'calculatePlannedDate', 'isFamilyMould', and 'storedCavity'. Either include them or remove the dependency array react-hooks/exhaustive-deps
2022-09-05T10:34:04.2733047Z Line 760:53: Expected to return a value at the end of arrow function array-callback-return
2022-09-05T10:34:04.2736135Z Line 763:11: Arrow function expected a return value array-callback-return
你可以做的一件事是在复制package.json后运行你的yarn安装。这样，Docker就可以在你再次运行构建时重用缓存层，而不会对package.jsson进行任何更改。
像这个
FROM node:16.9.1-alpine as build
WORKDIR /app
# Copy required files/folders to docker directory
COPY package.json /app
COPY package-lock.json /app
# Install yarn dependencies
RUN yarn install --frozen-lockfile --non-interactive --production=false --ignore-scripts
COPY lerna.json /app
COPY yarn.lock /app
COPY babel.config.js /app
COPY shared /app/shared
COPY projects/tt-core /app/projects/tt-core
# Build the tt-core project
RUN yarn build:tt-core
如果你这样做，那么第一次构建将花费与现在相同的时间，但只要你不更改package.json或package-lock.json，后续构建就会更快。
您可以这样构建Dockerfile：
FROM node:16.9.1-alpine as build
WORKDIR /app
# Copy required files/folders to docker directory
COPY package.json package-lock.json lerna.json yarn.lock babel.config.js /app
COPY shared /app/shared
COPY projects/tt-core /app/projects/tt-core
# Installing yarn dependicies and biuld the tt-core project
RUN yarn install --frozen-lockfile --non-interactive --production=false --ignore-scripts
&& yarn build:tt-core
# run reactjs with nginx in production
FROM nginx:stable-alpine
COPY --from=build /app/projects/tt-core/build /usr/share/nginx/html
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx/nginx.conf /etc/nginx/conf.d
COPY ssl /etc/ssl/certs
EXPOSE 80 443
CMD ["nginx", "-g", "daemon off;"]
这将为您节省Dockerfile中的一些步骤，并使其更加安全，因为层更少
但我不知道是否有大的提速。