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/

选择好分支及自己的打包目录

 

 

 

 

 

 

转载请注明原文链接：https://www.cnblogs.com/chenJieLing/

来源：https://www.cnblogs.com/chenJieLing/p/11653080.html