vue golang 同一台机器开发环境配置

golang 服务端
package main

import (
    "net/http"

    "github.com/gin-gonic/gin"
)

type MoneyType struct {
    ID   int    `json:"id"`
    Name string `json:"name"`
    Code string `json:"code"`
}

func main() {
    r := gin.Default()
    // 添加静态资源路径 
    r.Static("/static", "./dist/static")
    r.GET("/hello", func(c *gin.Context) {
        c.JSON(http.StatusOK, gin.H{
            "msg": "hello",
        })
    })
    r.GET("/", func(c *gin.Context) {
        c.HTML(http.StatusOK, "index.html", gin.H{})
    })

    r.GET("/api/moneytype", func(c *gin.Context) {
        c.JSON(http.StatusOK, gin.H{
            "data": &MoneyType{
                ID:   1,
                Name: "RMB",
                Code: "01",
            },
        })
    })

    r.Run(":8000")
}
vue 部分
vue.config.js
module.exports = {
    // 项目部署的基础路径
    // 我们默认假设你的应用将会部署在域名的根部,
    // 比如 https://www.my-app.com/
    // 如果你的应用时部署在一个子路径下,那么你需要在这里
    // 指定子路径。比如,如果你的应用部署在
    // https://www.foobar.com/my-app/
    // 那么将这个值改为 `/my-app/`
    //baseUrl: '/',
    // 将构建好的文件输出到哪里
    //outputDir: 'dist',

    // 放置静态资源的地方 (js/css/img/font/...)
    // golang 服务端 开静态服务 /static 目录
    // npm run build 时 js css 等文件存放在 dist/static目录下
    assetsDir: './static',

    devServer: {
    // 配置代理 转发不知名的请求到 golang 服务端
        proxy: 'http://localhost:8000',
    },
}
axios 在datatable组件中加载

    initialize() {
      axios.get("/api/moneytype").then(response=> {
        console.log(response.data)
        this.desserts = response.data.data
      });
    },

你可能感兴趣的:(vue golang 同一台机器开发环境配置)