一、前端环境搭建：

如果环境配置和我前面安装的一样只需下载yarn即可，如果是重新安装建议下载nvm。

参考视频：【评论送书】Go语言 Gin+Vue 前后端分离实战 - OceanLearn_哔哩哔哩_bilibili       

下载安装yarn:

npm install -g yarn

切换到项目文件夹创建项目：

cd D:/xxxx/xxx

vue create vue-test

选择手动配置 ：

项目配置过程大致如下：

 等待几分钟……

运行指令：

开启前端服务：

 打开网址：

通过Vscode打开前端网页，同样可以通过终端输入指令：yarn serve 开启网页

 下载eslint插件：

帮助代码进行格式化管理。

 对eslintrc.js进行配置：

module.exports = {
  root: true,
  env: {
    node: true,
  },
  extends: [
    "plugin:vue/vue3-essential",
    "@vue/airbnb",
  ],
  parserOptions: {
    parser: "@babel/eslint-parser",
  },
  rules: {
    indent: ["off"],
    semi: ["error", "never"],
    quotes: ["error", "double"],
    "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
    "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
  },
}