golang gin单独部署vue3.0前后端分离应用

夜晓码农

已于 2024-02-26 19:57:52 修改

阅读量1k

点赞数 5

分类专栏： Web 文章标签： golang gin 开发语言

于 2024-02-26 19:50:47 首次发布

本文链接：https://blog.csdn.net/qq_38189542/article/details/136307089

版权

Web 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文介绍了在使用Vue3.0作为前端框架和Gin作为后端API框架的项目中，如何构建前端并将其静态资源如CSS、JS和图片部署到后端，以及如何通过Gin处理静态文件和HTML模板的部署流程。

摘要由CSDN通过智能技术生成

概述

因为公司最近的项目前端使用vue 3.0，后端api使用golang gin框架。测试通过后，博文记录，用于备忘。

步骤

npm run build，构建出前端项目的dist目录，dist目录的结构具体如下图
将dist目录复制到后端程序同级目录，后端代码中添加以下命令

	r := gin.Default()
	r.Static("/css", "./dist/css")
	r.Static("/img", "./dist/img")
	r.Static("/js", "./dist/js")
	r.LoadHTMLGlob("dist/*.html") // 加载 HTML 模板
	r.GET("/", func(c *gin.Context) {
		c.HTML(http.StatusOK, "index.html", gin.H{})
	})
	....