vue部署在nginx存在的问题

最近遇见一个问题需要前端自己部署，自己以前也没有部署过，不太会使用nginx，现在记录下来。

1. 打包dist后部署在nginx上后没有生效，页面一直处重定向的404页面

// routet/index.js
// 一直重定向到这个页面

{ path: '*', redirect: '/404', hidden: true }

后来发现问题，就是本地配置的地址和nginx的对不上，与此同时打包的路径和nginx部署的路径也对不上。

// vue.config.js

module.exports = {
  publicPath: '/',  // 这里就是配置dist打包路径
  outputDir: 'dist',
  assetsDir: 'static',
  lintOnSave: process.env.NODE_ENV === 'development',
  productionSourceMap: false,
}

// router/index.js

export default () => {
  return new Router({
    routes,
    mode: 'history',    // 部署前改成hash
    base: '/base/dist/' // 这里配置的地址要和nginx保持一致
  })
}

以后遇见此类情况可以参考，不可以照抄。