3.部署到gitee

 

gitee官网:https://gitee.com/

 

步骤一:在根目录下新建一个 .spa 空文件;
原理:通过在根目录下增加.spa文件,Gitee Pages服务器的Ngnix规则就会变为:
try_files $uri $uri.html /index.html $uri/ -404

此时,即可开启支持单页应用(即不用再去写前端代码通过404.html重定向请求,而是将请求全部导向应用入口index.html实现单页请求);

 

步骤二:修改 .gitignore 文件;
原理:代码提交的时候,.gitignore文件默认的配置是将打包文件dist隐藏,但是后面发布的时候需要用到dist文件,所以需要将dist隐藏的配置去掉;

 

步骤三:修改路由设置,改为hash模式(路径:src/router/index.js);

 

步骤四:修改publicPath(其中myweb是库的名字);

情况一:如果没有vue.config.js文件,但是有webpack.base.conf.js文件,publicPath改写如下:

publicPath: process.env.NODE_ENV === "production" ? "/myweb/" : "./", //myweb是库的名字

 情况二:如果有vue.config.js文件,按下面替换:

const path = require('path')
const resolve = dir => {
  return path.join(__dirname, dir)
}
module.exports = {
  // publicPath: './',
  publicPath: '/myweb/' //库的名字,
  chainWebpack: config => {
    config.resolve.alias.set('_c', resolve('src/components')) // key,value自行定义,比如.set('@@', resolve('src/components'))
  },
  // 输出文件目录
  outputDir: 'dist'
}

 

步骤五:build/util.js 中添加:publicPath: "../../";
原理:为了解决css/字体访问不到的问题;

 

步骤六:config/index.js 中 build 里面的 assetsPublicPath: '/'改为assetsPublicPath: './';
原理:为了解决js访问不到的问题;

 

步骤七:保证代码在根目录下(即代码跟 .git 同级),然后执行npm run build打包;
原理:此时,在根目录下会生成一个dist文件夹,其中包含了index.html文件和一些压缩的css、js文件;

 

步骤八:代码上传至gitee;
执行:git add .
执行:git commit -m "submit"
执行:git push

 

步骤九:打开Gitee:https://gitee.com/
选择好分支及自己的打包目录

 

 

 

 

 

 

posted @ 2019-10-11 11:24  cjl2019  阅读(187)  评论(0编辑  收藏  举报