配置publicPath
// 生产环境则添加以下路径,此路径为你的仓库名
module.exports = {
publicPath: process.env.NODE_ENV === 'production'
? "/diandi-financials-demo/"
: '/',
}
生成dist,本地预览生产环境
npm run build
生成dist目录
本地对即将发布到生产环境状态的项目进行预览最简单的方式就是使用一个 Node.js 静态文件服务器,例如
serve
- 安装serve
npm install -g serve
- 运行serve,预览dist
serve -s dist
# -s 参数的意思是将其架设在 Single-Page Application 模式下
本地写一个sh脚本用以自动更新代码到远程仓库
在项目目录下,创建内容如下的 deploy.sh 并运行它以进行部署:
sh deploy.sh
- 在这里,我选择了在
github
中新建一个仓库,专用于放置dist
里面的文件,把新建的仓库名代替到下面的<REPO>
位置 - 运行如下代码可以自动把本地
dist
中的master分支
push到新仓库的gh-pages分支
,且自动生成了链接
#!/usr/bin/env sh
# 当发生错误时中止脚本
set -e
# 构建
npm run build
# cd 到构建输出的目录下
cd dist
# 部署到自定义域域名
# echo 'www.example.com' > CNAME
git init
git add -A
git commit -m 'deploy'
# 部署到 https://<USERNAME>.github.io/<REPO>
git push -f git@github.com:<USERNAME>/<REPO>.git master:gh-pages
cd -