使用Docker部署Flutter web项目
共 1567字，需浏览 4分钟
· 2021-03-25
Flutter web已经发展到稳定版了，之前开发的Qools项目现在准备打包，并部署到docker上。
Flutter web构建
在构建前，先run项目，确保项目在本地正常运行。
fvm flutter build web
cd项目根目录,运行上面命令，这里使用了fvm管理flutter sdk版本，所以前面多了个fvm。
build文件下就会出现web文件夹，文件夹内就是构建好的web项目了，需要把这些部署到服务器。
Docker部署
Docker是用来做软件发布的一个软件，是一个工具。需要在自己服务器上安装docker,我的阿里云服务器系统：CentOS8。可以参考：https://www.runoob.com/docker/centos-docker-install.html
安装docker
先登入服务器，终端输入
sudo yum install -y docker
启动docker服务
sudo systemctl start docker
systemctl enable docker # 开机启动
获取nginx镜像
docker pull nginx
运行 docker images 查看Nginx镜像是否获取成功，如下所示即为获取成功。
继续运行如下命令，在本机80端口运行Nginx服务器：
docker run -p 80:80 -d nginx
如图
列出容器
docker ps
记住CONTAINER ID 或 NAMES ，后面会用到。
在服务器新建目录，用来存放前面构建好的web项目，拷贝项目到你的目录中。
服务器存放项目路径： /usr/qson/nginx/html
配置文件路径： /usr/qson/nginx/default.conf如果不需要更改，可以省略这一步
将上面服务器2个路径下的文件拷贝到docker容器
拷贝default.conf文件
如果不需要更改default.conf，可以省略这一步
docker cp /usr/qson/nginx/default.conf ${CONTAINER ID}://etc/nginx/conf.d/default.conf
${CONTAINER ID}这个替换成前面的CONTAINER ID,这边的CONTAINER ID是f8e9bb900547，即
docker cp /usr/qson/nginx/default.conf f8e9bb900547://etc/nginx/conf.d/default.conf
拷贝项目文件，关键
docker cp /usr/qson/nginx/html f8e9bb900547://usr/share/nginx/html
通过服务器终端更新docker nginx
docker exec f8e9bb900547 nginx -s reload
然后浏览器直接输入ip地址访问，即可看到自己的项目
qools web项目地址：http://101.37.147.31/