diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 00000000..72cc5399 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,4 @@ +FROM nginx +RUN mkdir /app +COPY ./dist ./index.html /app/ +COPY nginx.conf /etc/nginx/nginx.conf \ No newline at end of file diff --git a/nginx.conf b/nginx.conf new file mode 100644 index 00000000..385df250 --- /dev/null +++ b/nginx.conf @@ -0,0 +1,30 @@ +user nginx; +worker_processes 1; +error_log /var/log/nginx/error.log warn; +pid /var/run/nginx.pid; +events { + worker_connections 1024; +} +http { + include /etc/nginx/mime.types; + default_type application/octet-stream; + log_format main '$remote_addr - $remote_user [$time_local] "$request" ' + '$status $body_bytes_sent "$http_referer" ' + '"$http_user_agent" "$http_x_forwarded_for"'; + access_log /var/log/nginx/access.log main; + sendfile on; + keepalive_timeout 65; + server { + listen 80; + server_name localhost; + location / { + root /app; + index index.html; + try_files $uri $uri/ /index.html; + } + error_page 500 502 503 504 /50x.html; + location = /50x.html { + root /usr/share/nginx/html; + } + } +} \ No newline at end of file diff --git a/web/src/pages/Doc/en/deploy/index.md b/web/src/pages/Doc/en/deploy/index.md index dbad2642..87ca8291 100644 --- a/web/src/pages/Doc/en/deploy/index.md +++ b/web/src/pages/Doc/en/deploy/index.md @@ -63,6 +63,41 @@ However, this requires backend support, as our application is a single page clie ## Docker +### Official image + +Starting from `v0.9.10+`, the author also provided a Docker image for use. + +```bash +docker run -d -p 8080:80 wanglin/mind-map:latest +``` + +This image uses Nginx to deploy applications and will provide access on port 80. Page not found or 404 error will return 'index. html'. + +You can also package the image yourself, and the 'Dockerfile' and 'nginx.conf' files are provided in the project root directory, which you can modify according to your own needs. + +Firstly, it is necessary to package the 'web' project locally: + +```bash +cd web +npm run build +``` + +Then execute the image packaging command in the project root directory: + +```bash +docker build . -t mind-map:0.9.10 +``` + +You can modify the image name of the above command yourself. After packaging, you can run the following command to start the container: + +```bash +docker run -d -p 8080:80 mind-map:0.9.10 +``` + +Browser input `http://localhost:8080` You can access it now. + +### Unofficial image + > Thank you very much [水车](https://github.com/shuiche-it), This section is written by him, and the corresponding Docker package is also maintained by him. Install directly from Docker Hub: diff --git a/web/src/pages/Doc/en/deploy/index.vue b/web/src/pages/Doc/en/deploy/index.vue index 824c6537..928cd76f 100644 --- a/web/src/pages/Doc/en/deploy/index.vue +++ b/web/src/pages/Doc/en/deploy/index.vue @@ -39,6 +39,24 @@ npm link simple-mind-map

However, this requires backend support, as our application is a single page client application. If the backend is not properly configured, users will return 404 when accessing sub routes directly in the browser. Therefore, you need to add a candidate resource on the server that covers all situations: if the 'URL' cannot match any static resources, the same 'index. html' page should be returned.

Docker

+

Official image

+

Starting from v0.9.10+, the author also provided a Docker image for use.

+
docker run -d -p 8080:80 wanglin/mind-map:latest
+
+

This image uses Nginx to deploy applications and will provide access on port 80. Page not found or 404 error will return 'index. html'.

+

You can also package the image yourself, and the 'Dockerfile' and 'nginx.conf' files are provided in the project root directory, which you can modify according to your own needs.

+

Firstly, it is necessary to package the 'web' project locally:

+
cd web
+npm run build
+
+

Then execute the image packaging command in the project root directory:

+
docker build . -t mind-map:0.9.10
+
+

You can modify the image name of the above command yourself. After packaging, you can run the following command to start the container:

+
docker run -d -p 8080:80 mind-map:0.9.10
+
+

Browser input http://localhost:8080 You can access it now.

+

Unofficial image

Thank you very much 水车, This section is written by him, and the corresponding Docker package is also maintained by him.

diff --git a/web/src/pages/Doc/zh/deploy/index.md b/web/src/pages/Doc/zh/deploy/index.md index 3d5a212a..dba70281 100644 --- a/web/src/pages/Doc/zh/deploy/index.md +++ b/web/src/pages/Doc/zh/deploy/index.md @@ -63,7 +63,42 @@ const router = new VueRouter({ ## Docker -> 非常感谢[水车](https://github.com/shuiche-it),本小节由他编写,对应的 Docker 包也由他维护。 +### 官方镜像 + +从 `v0.9.10+` 开始作者也提供了一个 `docker` 镜像可供使用。 + +```bash +docker run -d -p 8080:80 wanglin/mind-map:latest +``` + +该镜像使用 `Nginx` 部署应用,会在 `80` 端口提供访问。页面未找到 或 404 错误会返回 `index.html`。 + +你也可以自己打包镜像,项目根目录下提供了 `Dockerfile` 和 `nginx.conf` 文件,你可以根据自己的需求来修改。 + +首先需要在本地打包 `web` 项目: + +```bash +cd web +npm run build +``` + +然后在项目根目录执行镜像打包命令: + +```bash +docker build . -t mind-map:0.9.10 +``` + +上述命令的镜像名称你可以自行修改,打包完后可以运行以下命令启动容器: + +```bash +docker run -d -p 8080:80 mind-map:0.9.10 +``` + +浏览器输入`http://localhost:8080`就能访问到了。 + +### 非官方镜像 + +> 非常感谢[水车](https://github.com/shuiche-it)维护的非官方镜像。 直接从 Docker hup 中安装: diff --git a/web/src/pages/Doc/zh/deploy/index.vue b/web/src/pages/Doc/zh/deploy/index.vue index f163a7d6..2b1fc911 100644 --- a/web/src/pages/Doc/zh/deploy/index.vue +++ b/web/src/pages/Doc/zh/deploy/index.vue @@ -39,8 +39,26 @@ npm link simple-mind-map

不过这需要后台支持,因为我们的应用是个单页客户端应用,如果后台没有正确的配置,当用户在浏览器直接访问子路由时会返回404,所以呢你要在服务端增加一个覆盖所有情况的候选资源:如果URL匹配不到任何静态资源,则应该返回同一个index.html页面。

Docker

+

官方镜像

+

v0.9.10+ 开始作者也提供了一个 docker 镜像可供使用。

+
docker run -d -p 8080:80 wanglin/mind-map:latest
+
+

该镜像使用 Nginx 部署应用,会在 80 端口提供访问。页面未找到 或 404 错误会返回 index.html

+

你也可以自己打包镜像,项目根目录下提供了 Dockerfilenginx.conf 文件,你可以根据自己的需求来修改。

+

首先需要在本地打包 web 项目:

+
cd web
+npm run build
+
+

然后在项目根目录执行镜像打包命令:

+
docker build . -t mind-map:0.9.10
+
+

上述命令的镜像名称你可以自行修改,打包完后可以运行以下命令启动容器:

+
docker run -d -p 8080:80 mind-map:0.9.10
+
+

浏览器输入http://localhost:8080就能访问到了。

+

非官方镜像

-

非常感谢水车,本小节由他编写,对应的 Docker 包也由他维护。

+

非常感谢水车维护的非官方镜像。

直接从 Docker hup 中安装:

docker run -d -p 8081:8080 shuiche/mind-map:latest