在Nginx上部署VUE项目,找不到css、js等静态文件

j2qf4p5b  于 7个月前  发布在  Nginx
关注(0)|答案(1)|浏览(246)

我的操作系统是windows,在Nginx服务器上部署VUE项目。

  1. Build VUE project cd E:\test\test-project-frontend-demo npm install && npm run build
    1.配置nginx:
    nginx.conf
worker_processes  1024;

pid                     logs/nginx.pid;

events {
    multi_accept        on;
    worker_connections  65535;
}

http {
    #MIME
    include             mime.types;
    default_type        application/octet-stream;

    #LOGGING
    log_format          main  '$remote_addr - $remote_user [$time_local] "$request" '
                            '$status $body_bytes_sent "$http_referer" '
                            '"$http_user_agent" "$http_x_forwarded_for"';

    access_log          logs/access.log     main;
    error_log           logs/error.log      warn;

    charset             utf-8;
    sendfile            on;
    tcp_nopush          on;
    tcp_nodelay         on;
    server_tokens       off;
    log_not_found       off;
    types_hash_max_size 2048;
    client_max_body_size 16M;
    #keepalive_timeout  0;
    keepalive_timeout   65;
    gzip  on;

    #SITES
    include sites-available/project.conf;
}

字符串
project.conf

server {
    listen          80;
    listen          443 ssl;

    server_name project.testltd.com;

    # security
    include nginxconfig.io/security.conf;

    # logging
    access_log logs/project.access.log;
    error_log logs/project.error.log warn;

    # site project
    location / {
        alias E:/test/test-project-frontend-demo/dist;
        index index.html;
        try_files $uri $uri/ /index.html;
    }

    # additional config
    include nginxconfig.io/general.conf;

    # ssl config
    include nginxconfig.io/self-signed.conf;
    include nginxconfig.io/ssl-params.conf;
}


启动nginx:nginx. exe-c conf/nginx.conf
x1c 0d1x的数据
index.html可以访问,响应是200,但静态文件如css和js不能访问,为什么?

insrf1ej

insrf1ej1#

检查index.html是否使用静态路径,如

<link rel="stylesheet" href="/style.css">

字符串
如果是,则需要是相对路径

<link rel="stylesheet" href="./style.css">


它可以在你的构建工具配置文件中设置。
例如,使用Vite,在vite.js.js中,将“base”选项设置为空字符串或“./"。

相关问题