前言

我们开源的vue新项目怎么在线上访问得到呢？购买服务器自己搭建？不需要。好好利用好github这平台就行了。

开始

第一步

• 这vue项目的根路径创建start.sh 然后在start.sh文件中配置以下内容

  当发生错误时中止脚本

  set -e

  构建

  npm run build

  cd 到构建输出的目录下

  cd dist git init git add -A git commit -m 'start'

  部署到 https://<github用户名>.github.io/<仓库名>

  git push -f git@github.com:<github用户名>/<仓库名>.git master:gh-pages cd -

• 在vue.config.js文件中配置以下内容 module.exports = { // 生产环境 sourceMap productionSourceMap: false, publicPath: process.env.NODE_ENV === 'production' ? '/仓库名/' : '/' }

第二步

在当前项目根目录下右击打开git bash Here(一定要git打开不然执行不了.sh文件，我的是win10)

然后切换到主分支(默认)执行 sh start.sh （eslint报错自己修改）

然后github打开该项目的setting ，拉到下面GitHub Pages, 如我的 点击网址就能访问了，这就大功告成了！网址是因为我的绑定了域名不然的应该为：xxxx.gihub.io/xxxx这个格式

下面放上我的完整配置图