Go1.16 embed 和 Vue

vue

相关代码： https://github.com/Allenxuxu/ginvue

先全局安装下 vue cli 并创建一个 demo 项目

npm install -g @vue/cli
vue create web

然后我们进入 web 目录，修改生成的 package.json 文件调整一下 build 生成的静态文件目录。

--dest 是指定输出的目录

**--no-clean 是让他不要每次覆盖我们的目录，因为后面我们会放一个 go 文件到那个目录。 **

"build": "vue-cli-service build --no-clean --dest ../static",

再新增一个 vue.config.js 文件来修改下 , 这里将 production 的 publicPath 修改成带一个前缀 /ui/ , 这里主要就是为了后面我们的 go 代码路由设置方便，所有的前端静态文件请求都带上 /ui 前缀，和后端 API 接口带 /api 前缀区分。

​
module.exports = {
    publicPath: process.env.NODE_ENV === 'production'
        ? '/ui/'
        : '/'
}

最后我们再 web 目录运行 npm run build，会生成一个 static 目录（也就是我们修改的 package.json 里指定的目录），里面会存放生成的静态文件。

.
├── css
│   └── app.fb0c6e1c.css
├── favicon.ico
├── img
│   └── logo.82b9c7a5.png
├── index.html
├── js
│   ├── app.cdde1042.js
│   ├── app.cdde1042.js.map
│   ├── app.e656f618.js
│   ├── app.e656f618.js.map
│   ├── chunk-vendors.ff672a17.js
│   └── chunk-vendors.ff672a17.js.map
​

go

我们再 static 目录里增加一个 go 文件，这里使用 1.16 的 embed 来嵌入当前目录的静态文件：

go build -o /tmp/demo main.go