apache - 如何为 Angular 2 配置 Apache

Question

我需要为 angular2 配置虚拟主机。我试过关注这篇文章

https://www.packtpub.com/mapt/book/Web+Development/9781783983582/2/ch02lvl1sec15/Configuring+Apache+for+Angular

根据这个我需要像这样设置虚拟主机

<VirtualHost *:80>
    ServerName my-app

    DocumentRoot /path/to/app

    <Directory /path/to/app>
        RewriteEngine on

        # Don't rewrite files or directories
        RewriteCond %{REQUEST_FILENAME} -f [OR]
        RewriteCond %{REQUEST_FILENAME} -d
        RewriteRule ^ - [L]

        # Rewrite everything else to index.html
  # to allow html5 state links
        RewriteRule ^ index.html [L]
    </Directory>
</VirtualHost>

任何人都可以告诉我应用程序的路径应该是什么，因为我的应用程序在默认的 angular 2 端口 4200 上运行。有没有其他方法可以做到。

Answer 1

angular-cli 构建

在您的本地开发环境中，在您的项目根目录中运行 ng build --prod。

这将创建一个名为 dist 的文件夹，您希望将 dist 中的所有文件和文件夹放置到服务器上的 Apache 根目录中。

设置 apache 以提供到 index.html 的路由。您可以使用两种方法，编辑您的虚拟主机或在您的网站根目录中使用 .htaccess。

---

选项 1:虚拟主机

<VirtualHost *:80>
    ServerName my-app

    DocumentRoot /path/to/app

    <Directory /path/to/app>
        RewriteEngine on

        # Don't rewrite files or directories
        RewriteCond %{REQUEST_FILENAME} -f [OR]
        RewriteCond %{REQUEST_FILENAME} -d
        RewriteRule ^ - [L]

        # Rewrite everything else to index.html
        # to allow html5 state links
        RewriteRule ^ index.html [L]
    </Directory>
</VirtualHost>

---

选项 2:.htaccess

<IfModule mod_rewrite.c>
    RewriteEngine on

    # Don't rewrite files or directories
    RewriteCond %{REQUEST_FILENAME} -f [OR]
    RewriteCond %{REQUEST_FILENAME} -d
    RewriteRule ^ - [L]

    # Rewrite everything else to index.html
    # to allow html5 state links
    RewriteRule ^ index.html [L]
</IfModule>