方便查看所有教程,做了个索引目录 www.yuque.com/lzan13/nepe…
管理端和首页项目比较简单,就是普通的Vue项目,只需要按配置下接口的地址,然后打包发布静态页面就OK了
管理端项目
主要就是环境变量的配置,复制模板到对应的环境配置,修改其中的值就OK了,然后按照下边本地开发与发布线上命令进行相应操作,其中线上API地址需要和后端Nginx配置对应
与之配套www.yuque.com/lzan13/nepe…
# index.html 动态参数
vmViteDescription = "描述"
vmViteKeywords = "关键字"
vmViteTitle = "站点标题"
# 端口号
vmVitePort = 9527
# 静态资源打包目录 本地环境直接置空或者设置'/'
vmVitePath = "/admin"
# 是否开启Https
vmViteSSL = false
# 运行 npm run dev 时是否自动打开浏览器
vmViteOpen = false
# 配置 API 请求地址
vmViteApiHost = "http://localhost:5920"
# 媒体资源域名配置
vmViteMediaHost = "https://data.media.xxxxx.com"
# 配置 WebSocket 链接地址
vmViteWSHost = "ws://127.0.0.1:5920"
# 环境
vmViteEnv = "prod"
本地开发调试
记得复制config/.env.template一份到 confi/.env.development 然后修改里边对应的值为开发配置
# 安装依赖
$ yarn install
# 开发调试,会监听文件改动重新加载
$ yarn dev
# 更新依赖
$ yarn upgrade-interactive --latest
发布上线
记得复制config/.env.template一份到 confi/.env.production 然后修改里边对应的值为线上配置
# 打包编译
$ yarn build
# 规则检查
$ yarn lint
# 打包发布代码
$ tar -czvf ./vmnepentheadmin.tgz -C dist .
# 将打包的代码上传到要发布的服务器上,解包
$ scp vmnepentheadmin.tgz aly:/var/www/vmnepenthe/admin/; rm vmnepentheadmin.tgz
# 解压打包的资源
$ tar -xzvf vmnepentheadmin.tgz .; rm vmnepentheadmin.tgz
# 重启 ngnix
$ /etc/init.d/nginx restart
\
首页项目
这个项目纯粹是静态页面,主要是首页展示,以及用户隐私协议相关,只需要同步项目之后,修改相应资源,比如图片,描述文案等,然后按照命令打包发布就OK了
本地开发调试
# 安装依赖
$ yarn install
# 开发调试,会监听文件改动重新加载
$ yarn dev
发布上线
# 打包编译
$ yarn build
# 规则检查
$ yarn lint
# 打包发布代码
$ tar -czvf ./vmnepenthehome.tgz -C dist .
# 将打包的代码上传到要发布的服务器上,解包
$ scp vmnepenthehome.tgz aly:/var/www/vmnepenthe/home/; rm vmnepenthehome.tgz
# 解压打包的资源
$ tar -xzvf vmnepenthehome.tgz .; rm vmnepenthehome.tgz
# 重启 ngnix
$ /etc/init.d/nginx restart