将 AngularJS 主题转换为普通的 HTML 主题答案

【问题标题】：Converting AngularJS theme into normal HTML theme将 AngularJS 主题转换为普通的 HTML 主题
【发布时间】：2016-11-27 05:56:41
【问题描述】：

我即将开发一个 Web 应用程序。我将使用这个主题 - http://startangular.com/product/flatlogic-angular-material-dashboard/ 作为管理面板。我已经按照说明将它安装在我的本地机器上。但这是我第一次使用命令行（npm、gem 和 gulp）安装这样的 html 主题。

我还注意到所有 AngularJS 管理面板主题都必须以这种方式安装。我的意思是使用 npm 和其他命令。安装没问题。当我运行这个命令时

gulp serve

它会打开浏览器并显示管理面板。但问题是我不了解项目结构。

当我提供 gulp 服务时，管理面板正在工作。但我想要的是我只想在不提供服务的情况下访问。我的意思是我想把它移到xampp。然后与框架（PHP）集成。所以现在当我直接访问时，它不起作用。我想要的是我只想有一个简单的项目，像这样

/project
========
       /css
       /js
       /view

如何将它们构建到其中？我的意思是使用命令行。现在我必须服务 gulp 才能访问我的项目。要手动转换，我检查了 index.html 并且有很多我不熟悉的语法注释。

例如

<!-- build:css({.tmp/serve,src}) styles/vendor.css -->
    <!-- bower:css -->

如何将 Angular 主题转换为简单项目以发送到服务器进行部署？可以通过命令行完成吗？

现在我的项目在下

c:/xampp/htdocs/material_dashboard/angular-material-dashboard

当我访问它时

 http://localhost/material_dashboard/angular-material-dashboard/src/

它什么也没显示。就是白屏。浏览器控制台也没有错误。

当我访问它时

http://localhost/material_dashboard/angular-material-dashboard/.tmp/serve/

它正在显示这些错误。

所有状态码 404 返回。

如何在不使用 Gulp 的情况下访问项目？我可以从哪个网址访问？

【问题讨论】：

你不必使用开发服务器；只需将文件从输出目录复制到您选择的 Web 服务器，无需“转换”。如果您尝试从 Web 服务器访问 index.html 并收到错误消息，请发布该错误，否则其他人无法知道您可能错过了什么。
你真的build这个项目吗？尝试运行gulp build，然后将那个输出复制到您的服务器。
是的，我构建了运行该命令。 :(
如果你想让这个主题不是一个依赖Angular的单页应用，这是不可能的，因为它依赖于Angular Material。
您为什么要访问/src/ 树？构建项目后，您应该只是从项目根目录加载 index.html....

标签： angularjs gulp angular-material

【解决方案1】：

开发服务器

Angular 应用程序是 JavaScript、HTML、CSS 的混合体，每个路径都相对于应用程序的根目录 - index.html。

在这种情况下，复制 dist 文件夹的内容。复制整个 dist 文件夹并部署它。

开发服务器只是试图模拟真实的生产服务器。如果它在开发中工作 - 通过gulp server 执行的那个也应该在生产环境中工作。

生产环境

是时候直接申请了。只有两个主要步骤

用gulp build 构建它（当然，如果你正在使用 gulp 并且有类似的任务）
将构建目录的内容复制到生产环境（该步骤也称为部署）

CORS 问题？

AngularJS 应用程序和后端应该在相同的协议、域和端口地址上执行（应该运行）以避免 CORS 策略规则。

【讨论】：