本教程第 40 步骤,笔者介绍了如何制作 SAP UI5 应用能够部署到 Web 服务器上的 Release 版本(或者称作 Distribution 版本),即如何用工具自动生成 component-preload.js 文件:

SAP UI5 应用开发教程之四十 – 如何制作包含了 component-preload.js 在内的 SAP UI5 发布版本

有读者现学现用,马上使用第九个步骤文件夹里的源代码做了尝试,但是却发现了问题:

为什么我将代码部署在了本地tomcat上,也把dist文件夹挪进去了,执行还是会加载两次Component-preload.js,也会加载Component.js,并且报错404,使用的是第九篇教程Component的代码。 报错:failed to load JavaScript resource: sap/ui5/walkthrough/Component-preload.js – sap.ui.ModuleSystem

本文笔者就带着大家一起来分析这个问题。

问题分析

首先我们回忆一下步骤 40 介绍的知识:package.json 定义了名叫 build 的脚本,执行命令行为 ui5 build --clean-dest

于是我们可以通过 npm run build 命令行来执行这个脚本,对 SAP UI5 应用源代码进行 build(构建):

成功构建后,在当前目录生成一个 dist 文件夹:

dist 文件夹里包含有构建之后自动生成的 Component-preload.js 文件。大家仔细观察 dist 文件夹里的子文件夹,发现这些子文件夹都来自原来的 webapp 文件夹里的子文件夹。并且极其重要的一点:dist 文件夹下面,不再存在 webapp 这个文件夹了!请记住我们观察到的这一点。

我们把 dist 文件夹拷贝到 tomcat 的 webapps 文件夹下,启动 tomcat 服务器,通过 url http://localhost:8080/dist/ 即可访问这个构建之后的 SAP UI5 应用,也能观察到 Component-preload.js 文件被加载了。实际上,http://localhost:8080/dist/ 指向的是 http://localhost:8080/dist/index.html.

我们再来到出问题的 09 文件夹。

为了不影响原始的 09 步骤,我把 09 文件夹原封不动地拷贝了一份,重命名为 09-build.

我在 09-build 文件夹下的 package.json 里也增添了一个 build 脚本,然后执行 npm run build:

构建之后的 index.html 和 Component-preload.js 文件,出现在构建后生成的 dist 文件夹的 webapp 文件夹内。

可想而知,当我们把这个结构的 dist 文件夹拷贝到 tomcat 的 webapps 文件夹下时,我们访问 http://localhost:8080/dist/ 是不可能正常工作的,因为如今 index.html 是放在 /dist/webapp 下面,而不是像步骤 40 那样,直接放在 /dist/ 下面。

就算我们把访问 tomcat 的 url,手动添加上 webapp,即 http://localhost:8080/dist09/webapp/ (请忽略这里的 dist22 ,我将步骤 40 的 dist 文件夹放到了 tomcat 的 webapps 文件夹,将 09-build 构建出来的 dist,重命名成 dist09,然后同样放置到了 tomcat webapps 文件夹下 ),Component-preload.js 也没有办法成功加载。

本文余下部分介绍这个问题的解决方案。

原文地址:http://www.cnblogs.com/sap-jerry/p/16863306.html

1. 本站所有资源来源于用户上传和网络,如有侵权请邮件联系站长! 2. 分享目的仅供大家学习和交流,请务用于商业用途! 3. 如果你也有好源码或者教程,可以到用户中心发布,分享有积分奖励和额外收入! 4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解! 5. 如有链接无法下载、失效或广告,请联系管理员处理! 6. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需! 7. 如遇到加密压缩包,默认解压密码为"gltf",如遇到无法解压的请联系管理员! 8. 因为资源和程序源码均为可复制品,所以不支持任何理由的退款兑现,请斟酌后支付下载 声明:如果标题没有注明"已测试"或者"测试可用"等字样的资源源码均未经过站长测试.特别注意没有标注的源码不保证任何可用性