vite-scene-web

初始化

yarn

yarn serve

目录结构

|-build
|-public // 静态资源
|-src
  |- api // 接口文件
  |- types // 类型声明
  |- assets // 公用代码资源
  |- components // 公用组件
  |- views // 项目页面入口
  |- utils // 公用工具函数
  |- router // 路由配置
  |- store // 全局状态管理
  |
  |- env.d.ts // 环境变量声明
  |- global.d.ts // 全局变量声明
  |- el.d.ts // element 声明

多场景模式

⚠️ /public 下为公用文件，不要在场景分支里修改

通过 process.env.SCENE 区分场景

尽量避免使用 .vue 自定义后缀，ide 暂不能友好支持模糊匹配 .vue，需要明确使用 demo.vue，导致无法区分场景

关于分支

release 稳定版本，线上代码稳定一段时间后同步 release-buffer

release-buffer 发布版本，场景线分支发布生产环境需要合回此分支，使用 --no-ff 记录合并操作

🚀 关于代码格式化

推荐使用 ide 插件，在 ide 扩展中下载 prettier

以 vscode 为例：

在 file -> preferences -> setting 中搜索 defaultFormatter
选择 Prettier - Code formatter
接着搜索 format
将 editor: format on save 勾选

🤖 关于自动化部署

发布地址：http://face3d.4dage.com:29394/deploy/app

新建的分支如果需要自动化部署，需要在 package.json 下增加指令

举例：新增一个demo大场景
1. 在 release-buffer 下新增 demo 分支
2. 在 scripts 中新增 push:demo 指令，注意 push: 后的参数需要与分支名相同
3. 注意：不要在 release* 下发布版本

测试环境项目地址：https://scene.4dage.com/?m=1172

scene=${SPUG_GIT_BRANCH%%/*}

echo "当前场景值：$scene"

if [ $SPUG_DEPLOY_TYPE == "2" ]
then
  echo "开始回滚"
  basename "$PWD"
else
  mv .temp/* .

  fileCount=$(find /home/spug_backup/vue3-scene-web/* -maxdepth 0 -type d -printf '.' | wc -c)
  echo "当前文件夹数量：$fileCount"

  if [ ${fileCount} -gt 1 ]
  then
    lastFileDir=$(ls -d -F /home/spug_backup/vue3-scene-web/* -t | grep '/$' | head -n 2 | tail -n 1)

    echo "上一个部署目录：$lastFileDir"

    if [ -d "${lastFileDir}data/" ]
    then
      echo "copy data file"
      cp -rTn ${lastFileDir}data/ ./data
    fi

    if [ -d "${lastFileDir}resources/web/" ]
    then
      echo "copy resources file"
      if [ $scene = "test" ]
      then
        rsync -rtvu --exclude=./js --exclude=./img --exclude=./fonts --exclude=./css ${lastFileDir}resources/web/ ./resources/web/
      else
        rsync -rtvu --exclude=$scene ${lastFileDir}resources/web/ ./resources/web/
      fi
    fi
  fi

  rm -r .temp
fi