nginx 配置vue dist文件访问及axios跨域

要在nginx中配置vue dist文件访问，您需要将nginx配置修改为以下内容：

server {
    listen 80;
    server_name yourdomain.com;

    # 静态文件目录，这里指向vue打包后的dist目录
    root /var/www/yourdomain.com/dist;

    # index.html作为默认页面
    index index.html;

    # 处理静态文件的请求
    location / {
        try_files $uri $uri/ /index.html;
    }
}

上面的代码将静态文件目录设置为`/var/www/yourdomain.com/dist`，这是您打包Vue项目后生成的dist目录。此外，我们还使用`try_files`指令来处理静态文件请求，这将使nginx尝试查找请求的文件，如果找不到，则重定向到index.html。

接下来，让我们来看看如何在nginx中配置axios跨域。

server {
    listen 80;
    server_name yourdomain.com;

    # 静态文件目录，这里指向vue打包后的dist目录
    root /var/www/yourdomain.com/dist;

    # index.html作为默认页面
    index index.html;

    # 处理静态文件的请求
    location / {
        try_files $uri $uri/ /index.html;
    }

    # 处理跨域请求
    location /api/ {
        proxy_pass http://your.api.server;
        add_header Access-Control-Allow-Origin *;
        add_header Access-Control-Allow-Methods 'GET, POST, OPTIONS, DELETE, PUT';
        add_header Access-Control-Allow-Headers 'Content-Type, Authorization, Accept';
    }
}

上面的代码将/api/路径下的所有请求代理到http://your.api.server，并添加了一些跨域响应头，包括`Access-Control-Allow-Origin`、`Access-Control-Allow-Methods`和`Access-Control-Allow-Headers`。

注意，如果您的Vue应用程序使用了Vue Router，那么您需要将router的模式设置为history模式，以便nginx正确地处理路由。您可以在Vue Router中进行如下配置：

const router = new VueRouter({
    mode: 'history',
    routes: [...]
})

希望这些信息能够帮助您！