在服务器上部署 angular2 的构建答案

【问题标题】：Deploy Build of angular2 on server在服务器上部署 angular2 的构建
【发布时间】：2017-08-30 14:17:26
【问题描述】：

我有一个使用 angular2 构建的网络应用程序，在运行 i 命令 ng build 后，在我的文件夹结构中创建了 dist 文件夹，现在我想在服务器上发布它。

所以我只需将dist 文件夹复制并粘贴到那里并运行index.html

但在开发者控制台中显示错误

Cannot match any routes. URL Segment: 'parentFolder/childFolder/dist'

我的基本 URL 中很可能有错误。

PS：我已经将 base href 设置为<base href="./">

有什么想法吗？

【问题讨论】：

你发布哪个服务器 apache ??还是tomcat？？
我正在使用的apche服务器
你能参考我的答案吗，下面的配置
如果你的挣扎请告诉我

标签： angular

【解决方案1】：

您需要复制服务器上 dist 文件夹的内容，而不是完全复制 dist 文件夹并设置基本 href<base href="./">。

dist 文件夹将包含 index.html 以及您的所有依赖项，例如 assets 等。

【讨论】：

但我想虽然 build <base href="/"> 是默认设置，但无论如何更改后都无法正常工作。是的 dist 文件夹什么都有
@PardeepJain ya 这将是我刚才提到的默认设置，你在哪里部署它？
我正在使用的apche服务器
@PardeepJain 你能尝试将基本参考路径更改为更新路径吗？我猜错误说它无法找到路由结构，使用它我们可以提供相对路径
没错，我已经使用手动设置路径，如 <base href="./"> 和 <base href="/"> 但无法正常工作

【解决方案2】：

你可以试试ng build --dev，然后做下面的apache配置

<VirtualHost *:80>
    ServerName test.io
    ServerAlias test.io

    DocumentRoot your_project_path/angular2/dist
    <Directory your_project_path/angular2/dist>
            Require all granted

            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>
 </VirtualHost>

【讨论】：

【解决方案3】：

用这个脚本替换基本标签

<script>
    document.write('<base href="' +String(document.location).replace('index.html','') + '">')
</script>

【讨论】：

你必须复制服务器中的 dist 文件夹（如果它的 tomcat 是 webapps 文件夹）。这个脚本将处理你在里面创建的子目录。我正在使用 tomcat 和 /parent/dist/index.html 工作正常。