共计 3146 个字符，预计需要花费 8 分钟才能阅读完成。
现状
前后分离开发模式现在非常流行，前后端工程师各自开发各端，各不干扰，提高开发效率。但是部署起来特别麻烦。前后端需要各自打包部署。传统的上线部署方式：前后端各自打包好，配置好数据库、redis 等中间件，通过 nginx 给 api、前端资源做反向代理，提供给用户访问。而 golang 是一门非常方便的开发语言，能把代码打包成一个可执行文件，部署起来非常方便。很显然传统的上线部署方式违背了 golang 便捷的原则。有没有可能把前后端打包在一起？
需求
以 go-admin 前后端分离项目为例，打包成一个可执行文件。
项目地址：https://github.com/go-admin-team/go-admin
环境
| 环境 | 语言和框架 | 版本 |
|---|---|---|
| 后端 | golang、gin | go 1.18 |
| 前端 | vue、element-ui | node v14.16.0 |
| 数据库 | mysql、sqlite3 | mysql8.0、sqlite3 |
实践
（1）拉取 go-admin 代码
go-admin 版本为 go-admin-2.1.1
go-admin-ui 版本为 go-admin-2.0.9
重点注意：两个项目必须放在同一文件夹下；
git clone https://github.com/go-admin-team/go-admin.git
git clone https://github.com/go-admin-team/go-admin-ui.git
（2）打包前端项目
修改配置文件，配置后端 api 接口
注意，注意，注意，VUE_APP_BASE_API 跨域问题。
.env.production
# just a flag
ENV = 'production'
# base api
VUE_APP_BASE_API = 'http://localhost:8000'
cd go-admin-ui
npm install
npm install --registry=https://registry.npm.taobao.org
npm run build:prod
（3）打包后端项目
安装 gin-contrib/static
github 地址：https://github.com/gin-contrib/static
go get github.com/gin-contrib/static
将前端打包好的 dist 目录移动到 go-adminappadminrouter 下
按理说可以将 dist 目录放置到 go-admin 根目录下或其他目录下，但是我没有尝试。
修改路由文件 sys_router.go
导入
import "github.com/gin-contrib/static"
修改文件
var front embed.FS
func InitSysRouter(r *gin.Engine, authMiddleware *jwt.GinJWTMiddleware) *gin.RouterGroup {
r.Use(static.Serve("/", static.EmbedFolder(front, "dist")))
r.NoRoute(func(c *gin.Context) {
fmt.Printf("%s doesn't exists, redirect on /n", c.Request.URL.Path)
c.Redirect(http.StatusMovedPermanently, "/")
})
g := r.Group("")
sysBaseRouter(g)
}
打包 go-admin，以 sqlite3 数据库为例，mysql 差不多
cd go-admin
go mod tidy
go build -tags sqlite3
（4）如何测试使用
将 go-admin.exe 拷贝到其他测试目录，如桌面的 demo 目录，并拷贝 config 目录。
go-admin.exe migrate -c config/settings.sqlite.yml
go-admin.exe server -c config/settings.sqlite.yml
____
,---, ,' , `. ,--,
,---. ,---,. ,---.'| ,-+-,.' _ |,--.'| ,---,
,----._,. ',' ,'.' | | | : ,-+-. ; , ||| |, ,-+-. / |
/ / '/ / / |,---.' , ,--.--. | | | ,--.'|' | ||`--'_ ,--.'|' |
| : |. ; ,. :| | |/ ,--.__| || | ,', | |,,' ,'| | | ,"' |
| | . .' | |: :: : .'.--. .-. | / ,' || | / | |--' ' | | | | / | |
. ; '; |' | .; :: |.'__/: . ..' / || : | | , | | : | | | | |
'. . || : |`---' ,".--.; |' ; |: || : | |/ ' : |__ | | | |/
`---`-'| | / / / ,. || | '/ '| | |`-' | | '.'|| | |--'
.'__/_: | `----' ; : .' : :|| ;/ ; : ;| |/
| : : | , .-./ / '---' | , / '---'
/ `--`---'`----' ---`-'`--`-'
欢迎使用 go-admin 2.1.1 可以使用 -h 查看命令
Server run at:
- Local: http://localhost:8000/
- Network: 172.24.80.1://http:8000/
Swagger run at:
- Local: http://localhost:8000/swagger/admin/index.html
- Network: http://172.24.80.1:8000/swagger/admin/index.html
2024-04-25 18:43:02 Enter Control + C Shutdown Server
（5）重点说明
这种方式只适用于中小型 web 项目，大型项目还是推荐前后端分离部署，方便解耦，更容易排查问题。
其实配置文件和 sqlite3 数据都可以嵌入可执行文件。但是 go-admin 需要 config 下的 sql 文件初始化数据库，因此需要拷贝 config 目录到与可执行文件同一目录。其他项目使用 gorm，可以直接配置迁移命令，将结构体转化到数据库，就不用 sql 文件，只需配置文件，若将配置文件也 embed 到可执行文件更方便，但是不方便将来做迁移。
另外推荐两款静态后台模板：光年 (Light Year Admin) 后台管理系统模板和 AdminLTE，可以用 vue 和 axios 调用后端接口，golang 集成 web 后台管理系统很好用。
项目推荐
花落南国北亭凉的博客，我的博客，哈哈
光年 (Light Year Admin) 后台管理系统模板
AdminLTE 后台模板
go-admin 后台管理项目
nunu 快速生成 golang 项目 CLI
wails：使用 Go 和 Web 技术构建桌面应用程序：支持 Vue，React，（强烈推荐，有趣）
相关文章
https://zhuanlan.zhihu.com/p/378635694
https://blog.hi917.com/detail/92.html
https://community.aidlux.com/postDetail/727
https://www.jb51.net/article/267543.htm
https://blog.csdn.net/weixin_41601114/article/details/115114577
https://blog.csdn.net/q1009020096/article/details/125267490
https://www.cnblogs.com/lxz123/p/15844156.html
https://www.jianshu.com/p/ba92441e25ba
原文地址: Golang 和 Vue 前后端分离项目打包一个可执行文件
