Question

我将使用docker部署我的项目。但我不确定要在docker中放置哪些文件夹。这些是我的文件夹；

.next
actions
api
components
constants
helpers
node_modules
pages
reducers
static
stores
.gitignore
next.config.js
package-lock.json
package.json
README.md
routes.js
server.js

我应将以下哪个文件夹和文件放入docker中？我应该如何在package.json中放置一个块？我的脚本文件当前为；

"scripts": {
    "dev": "node server.js",
    "build": "next build",
    "start": "NODE_ENV=production node server.js"
  }

我目前正在使用“ npm run build && npm run start”进行部署，但是重新编译了每个页面，这似乎在降低性能。

Answer 1

首先创建dockerignore文件加 a.dockerignore

node_modules
.next
npm-debug.log

dockerfile内容

FROM node:alpine
    # Create app directory
    RUN mkdir -p /usr/src/app
    WORKDIR /usr/src/app
    # Install app dependencies
    COPY package.json /usr/src/app/
    RUN npm install
    # Bundle app source
    COPY . /usr/src/app
    RUN npm run build
    EXPOSE 3000
    CMD [ "npm", "start" ]

Answer 2

基于浏览器的应用程序与Docker的容器化系统有点正交。在典型的生产使用中，您将使用Webpack之类的工具将应用程序编译为静态文件。这样一来，本地就不会实际运行您的应用程序代码了；取而代之的是，像Nginx这样的HTTP服务器会在不知道它们是什么的情况下向浏览器提供编译后的构件。

就Docker而言，您可能将dist之类的目录装载到一个普通的Web服务器容器中，该目录包含已编译的工件：

npm install
npm run build
sudo docker run -v $PWD/dist:/usr/share/nginx/html -p 8080:80 nginx

由于编译后的代码在浏览器中运行，而不是在Docker中运行，因此它无法利用容器间DNS之类的优势（浏览器不知道Docker存在并且必须与外部可见的主机名对话）。而且由于您最终将产生一个独立的编译工件，因此在Docker中运行工具链并没有真正获得任何收益。在开发期间，我只在主机上npm run start，而根本不参与Docker。

如何使用docker部署React（NextJS）项目？

2 个答案: