我编写了我的第一个 Angular 2 应用程序，我想把它放到一个测试服务器上。
我最近将其转换为 Angular-cli 项目并使用以下命令构建它：
ng build --prod
据我了解，我应该能够将“/dist”文件夹的内容粘贴到测试服务器上并使用
ng serve
但是，如果“/dist”文件夹可以独立运行，为什么我无法在我的电脑上将它作为独立应用程序运行（即，我无法将 dist 文件夹的内容复制到电脑上的另一个位置并运行它。）
这实际上是我将放在测试/生产服务器上的第一个应用程序，所以如果我的要求很愚蠢，请多多包涵。
【问题讨论】：
标签： angular angular-cli production
您有两个选择：您可以复制您的应用程序并运行ng serve --prod（我认为这有点过分），或者您可以将您的./dist 复制到另一台服务器并使用一些服务器软件（即nginx、apache , express - 有很多，你可以选择你熟悉的那个）。您只需将所有不是文件请求的请求传递给index.html，因为角度应用程序是SPA。以下是 Apache 服务器的 .htaccess 示例：
RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
# If the requested resource doesn't exist, use index.html
RewriteRule ^ /index.html
【讨论】：
你不应该，而且我认为不能，使用ng serve 来发布你的构建。使用ng build 创建的文件可以上传到网络服务器并从那里提供服务。
ng build -e=prod --prod --no-sourcemap --aot
虽然angular-cli 的最新版本默认没有源映射，但这里值得注意。 -e=prod 将确保它使用在 environments 文件夹中定义的生产环境。最后一件事是--aot。如果您的项目中没有特殊的事情发生，那么您很有可能可以使用提前编译器对其进行预编译。但是，您可能会遇到问题，您可以使用 ng serve --aot 解决这些问题，或完全删除 --aot。
dist 文件夹的内容复制到您的网络服务器。值得注意的是，您应该确保服务器上所有不存在的文件请求都将重定向到index.html，并且指向您的应用程序的 url 位于根目录中。 这意味着对于 index.html 重定向，例如 nginx，您可以将其放在服务器配置块中：
location / {
try_files $uri $uri/ /index.html;
}
如果 www.example.com 提供在 dist 文件夹中创建的 index.html。如果出于某种原因您希望从 www.example.com/subfolder 等子文件夹中提供您的应用程序，那么您应该修改生成的 index.html 中的 <base> 标记以指向该子文件夹。
如果您想在本地测试您的生产版本，一种选择是安装lite-server。
npm install -g lite-server
然后在控制台中导航到path/to/project/root/dist，然后运行lite-server。这将创建一个网络服务器并打开您的浏览器，并提供生成的index.html
如果您使用 nginx 并且想要更酷并静态地提供生成的 .gz 文件，您可以将其放在您的 nginx gzip 配置中：
gzip on;
gzip_static on;
【讨论】：
nb build --prod 将所有需要的文件放入dist 文件夹中。
您不需要ng serve 来运行构建的项目。
您需要将dist 内容放入任何服务器（甚至是某种本地主机）
ng serve 仅用于实时重新加载的开发。
【讨论】：