如何在 GitHub Pages 上部署 vue-cli 项目

1. 在 GitHub 上创建与本地项目同名的远程仓库

1
直接在GitHub 上新建一个远程仓库

2. 将本地项目 push 到远程

1
2
3
4
5
$ git init
$ git add .
$ git cmt -m 'create project'
$ git remote add origin git@github.com:yuhanle/resume.git
$ git push -u origin master

3. 将 dist 下的所有文件夹 push 到 gh-pages

1
2
3
4
5
$ npm run build
$ git checkout -b gh-pages
$ git add -f dist
$ git commit -m 'create project'
$ git subtree push --prefix dist origin gh-pages

这些步骤做完之后在 gh-pages 分支展示项目了,比如
https://yuhanle.github.io/resume/

4. 资源路径错误问题

  1. npm run build 之前要将 config/index.js 里边 build 配置里边的 assetsPublicPath: '/' 改成 assetsPublicPath: './'
  2. webpack.prod.conf.js 中的 removeAttributeQuotes 改为 false
请我喝杯咖啡吧~