使用apachevhost部署Vue应用程序显示白色页面

Question

我正在尝试使用apachevhost运行一个vue应用程序。但我只是看到了一张白纸。此外，我指定的ServerAlias不起作用，我必须使用IP。使用Ubuntu 16.04.7 LTS

Apache vhost-conf看起来像：

<VirtualHost *:80>
ServerName testConnection.test
ServerAlias www.testConnection.test
ServerAdmin [e-mail]
DocumentRoot /var/www/client/pvapp-client/public
<Directory /var/www/client/pvapp-client/public>
Options -Indexes +FollowSymLinks
Allow from all
AllowOverride All
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^(.*) /index.html [NC,L]
</Directory>
ErrorLog ${APACHE_LOG_DIR}/test.com-error.log
CustomLog ${APACHE_LOG_DIR}/test.com-access.log combined
</VirtualHost>

已经使用a2ensite命令启用了Vhost conf文件。并且禁用了标准conf文件。

router.js的部分看起来像：

const router = new Router({
mode: 'history',
routes: [
{
path: '/',
name: 'home',
component: Home
},
....

关于教程的vue.config.js：

module.exports = {
baseUrl: process.env.NODE_ENV === 'production' ? '/vue' : '/',
outputDir: 'build',
};

如上所述，vue应用程序目录为：

/var/www/client/pvapp-client/[All Vue stuff]

Answer 1

我刚刚为将来有同样问题的人解决了这个问题。

我需要将根路径指定为DIST，而不是PUBLIC:

...
DocumentRoot /var/www/client/pvapp-client/dist
<Directory /var/www/client/pvapp-client/dist>
...