vue history模式部署到Nginx刷新时404

项目部署到Nginx上,因为/更目录已经给了其他权限,说下直接把项目放到了/dist下面,所以build时候assetsPublicPath改为了相对路径

build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),

    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: './',

build的时候接口也是直接请求根路径是没问题的

const service = axios.create({
  //baseURL: process.env.ENV_CONFIG=='dev'?'/api':'', // api的base_url
  baseURL: process.env.ENV_CONFIG=='dev'?'/api':process.env.BASE_API,
  timeout: 5000, // 请求超时时间
  headers:{
    'isWeb': 1,
    'Content-Type': "application/json;charset=utf-8"
  }
})

但是按照官方的说法,Nginx如这样说的配置https://blog.csdn.net/u011025...,刷新还是报错404,然后我搜了下说可能是assetsPublicPath配置成绝对路径,但是配置成绝对路径的话静态资源就找不到了

clipboard.png
求大神解答

阅读 4.4k
2 个回答

问题也解决,谢谢大家,Nginx配置时候少了/dist目录而已
location /{

        root   dist;
        index  index.html;
        try_files $uri $uri/ /dist/index.html;
    }

https://router.vuejs.org/zh/g...

server {
    listen 80 default_server;
    server_name /var/www/example.com;

    root /var/www/example.com;
    index index.html index.htm;      

    location ~* \.(?:manifest|appcache|html?|xml|json)$ {
      expires -1;
      # access_log logs/static.log; # I don't usually include a static log
    }

    location ~* \.(?:css|js)$ {
      try_files $uri =404;
      expires 1y;
      access_log off;
      add_header Cache-Control "public";
    }

    # Any route containing a file extension (e.g. /devicesfile.js)
    location ~ ^.+\..+$ {
      try_files $uri =404;
    }

    # Any route that doesn't have a file extension (e.g. /devices)
    location / {
        try_files $uri $uri/ /index.html;
    }
}
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题