vue.js – Was das Vue-cli-Projekt betrifft, wird nach der Bereitstellung der Anforderungsseite app.js mit Nginx im VPS ein 404-Fehler angezeigt.

Question

Ich möchte meinen Lebenslauf auf meiner persönlichen Blog-Website veröffentlichen.
Ich möchte einen /me-Unterpfad zum Domänennamen des Servers hinzufügen, um auf meinen Lebenslauf zuzugreifen.
Natürlich ist mein Lebenslauf in Vue geschrieben und mit vue-cli erstellt
Nach der Bereitstellung auf dem Server führt npm dev aus und läuft erfolgreich auf dem Server-Port

给我你的怀抱 · Answer

其实这个问题我自己解决了。在nginx上不要将项目部署在非根目录上，路径很容易会错的。如果一个服务器有多个项目，那么可以在nginx上面配置不同端口的server 或者直接弄二级域名来指向nginx。

伊谢尔伦 · Answer

1、项目中找到config\index.js；
2、将build中的assetsPublicPath:'/'改为assetsPublicPath:''；
3、重新执行打包:npm run build；
4、发布，再试试。

世界只因有你 · Answer

对于用vue-cli构建的项目，采用npm run dev 启动服务适用于开发模式，相当于启动了一个server。
线上部署很少采用这种形式，线上部署都会提前npm run build，将代码打包到dist目录中，而dist目录其实是可运行的index.html+静态文件。我们部署的时候只需要将dist目录扔到服务器即可，而不是启动一个server。
nginx配置也比较简单：

server{
    listen 80;
    server_name domain.com;
    location /vue {
        alias /var/www/dist; #dist目录在服务器的位置
    }
}

这样当访问 https://域名/vue 的时候，就会定位到dist目录，而dist目录就是我们项目build之后可运行的静态文件。