默认的 angular-cli 构建生成具有非常扁平结构的 dist 文件夹 - 资产文件夹和 js、html 文件。有没有办法创建 fe.脚本文件夹并在构建过程中将所有js文件放入其中？
CLI 尚不完全支持这一点，但它确实提供了一些有用的工具来帮助您实现这一点。我需要它来部署我的 Angular 应用程序和 WAR，同时尝试最大限度地减少通过 servlet 映射增加的复杂性。这个问题没有具体提到J2EE，但我认为这个解决方案的原理可以在各种环境中共享。
相关的ng build参数：
-
--deploy-url：将应用于资源的路径映射。这可能与 Angular-CLI 当前最接近您正在寻找的内容一样。
-
--output-path：指定 Angular 构建的输出目录（特别是，我用它来为不同环境指定唯一的输出目录，因为应用程序被部署到具有不同配置的多个目标）。
-
--base-href：应用程序的根 URI。例如。，/angular-app/ for http://localhost:4200/angular-app/。这设置了<base href="<uri>">head 标签，对于非哈希路由是必需的。对于其他事情来说可能也是必要的。
对您来说最有趣的可能是--deploy-url。如果您将部署 URL 设置为/dist/，例如，那么在您构建的应用程序中对 JS 文件的引用将带有前缀/dist/.
这种方法有两个大问题：
-
--deploy-url不改变outputJS 文件的路径。它仅更改对 JS 文件的引用。文件本身仍将放置在根构建目录中。您必须在构建过程中添加一个步骤来手动修复此问题。
-
--deploy-url似乎不适用于任何其他资产。我将所有其他资产放入assets/目录，并且构建的输出仍然通过以下方式引用资产assets/<path>（而不是dist/assets/<path>如预期的）。您可以通过提供虚拟目录或 URL 重写来解决此问题。
作为参考，以下是我生成的 WAR 目录结构：
app/
dist/ <-- Deployed Angular application
assets/
(images, CSS, etc)
*.js
(other assets pulled into the root path, e.g. *.(svg|eot|woff|woff2|ttf) from Font Awesome)
index.html
WEB-INF/
...
index.jsp
这些是我生成此结构所采取的步骤：
-
ng build -pr false --prod --output-path build/node-prod --base-href /angular-app/ --deploy-url /angular-app/dist/.
- 复制内容
build/node-prod到 WAR 构建目录app/dist通过 gradle 任务。
- Point
index.jsp to index.html通过内容<%@include file="dist/index.html"%>.
- 为路径的默认 servlet（静态资产）添加 servlet 映射
/dist/* and /assets/*.
- 添加 URL 映射通过http://tuckey.org/urlrewrite/ http://tuckey.org/urlrewrite/ for
^/assets/(.*)$ to /dist/assets/$1（或通过 httpd、nginx 等）。这是需要的，因为上面给出的捕获--deploy-url不为其他资产工作。
- （可选）添加 301 或 302 重定向
^/dist/index.html$到根上下文路径以防止用户通过dist URI.
在生成的 Web 应用程序中，http://localhost/angular-app/是我的应用程序的唯一有效端点。该端点指向index.jsp，其中包括的内容index.html，它通过加载相关的JS<script src="/angular-app/dist/<some-file>.js"></script> tags.
当需要某些其他资产（例如徽标图像）时，页面会发出请求assets/<file-name>，通过 Tuckey 在服务器端重写为dist/assets/<file-name>，透明地解析为所请求的资产。
这个解决方案的好处是我们能够在根上下文中部署 Angular 应用程序，而无需将一切 that ng build内置到根 WAR 路径中。这特别好，因为我们不想添加全局 servlet 映射（例如，*.js）当它们可以避免时。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
