组件-preload.js生成

Question

我们即将关闭一个SAPUI5应用程序，最后一个步骤是创建一个Component-Preload.js文件以提高性能。我在网上阅读了不同的指南，他们都需要我安装的Node.js。我对那个包不是专家，我也想不出怎样才能让其中的一个指南起作用。我是用NetBeans开发的。据我所见，没有官方的工具(对吗？)生成那个文件。一个比我更有经验的人能建议一个工作的、解释清楚的指南来完成这个任务吗？

我不知道这能不能帮上忙，那是我的工作树

​

Answer 1

做这件事有几种主要的方法。

1. 您可以使用SAP来生成它。这假设您正在使用WebIDE开发应用程序(根据您的问题，这不是正确的)。常规版本的WebIDE在应用程序部署之前的“客户端构建”过程中生成此文件。
2. WebIDE的“多云”版本可以使用粗壮的构建来实现它。如果您感兴趣，可以在这里找到更多信息：https://www.sap.com/developer/tutorials/webide-grunt-basic.html。
3. 使用新的UI5命令行工具(https://npmjs.com/package/@ui5/cli)：

- Run `npm i -g @ui5/cli` to install the tools globally.
- Open the root of your project with your terminal.
- Run `ui5 build preload` to build the preload.

​

1. 使用@sap/grunt-sapui5-bestpractice-build预配置的grunt任务。缺点是，它们或多或少是黑匣子，不允许那么多的定制。您可以在SAP的GitHub存储库詹金斯-管道上找到一个示例设置。简而言之：

- You need to define an `.npmrc` file which adds the _@sap_ npm registry: `@sap:registry=https://npm.sap.com`.
- Run a [`npm init`](https://docs.npmjs.com/cli/init) command such that you generate a `package.json` file. This file describes your application and your dependencies (runtime dependencies and dev dependencies; you will only have dev dependencies for now, as you just want to build your app). Make sure to mark the package as private. See the [npm docu](https://docs.npmjs.com/files/package.json#license) (at the end of the license chapter).
- Then you can install grunt and the build configuration: `npm i grunt -D` and `npm i @sap/grunt-sapui5-bestpractice-build -D`.
- Lastly you need to define a simple Gruntfile (you can then run the build by just running `grunt`):

​

​

module.exports = function (grunt) {
    'use strict';
    grunt.loadNpmTasks('@sap/grunt-sapui5-bestpractice-build');

    grunt.registerTask('default', [
        'lint',
        'clean',
        'build'
    ]);
};

​

1. 您可以使用正式的grunt_openui5插件来生成预加载文件。为了能够做到这一点，需要安装节点：

- Create a _package.json_ (e.g. through `npm init`).
- Install grunt by writting in the console: [`npm install grunt-cli --save-dev`](https://gruntjs.com/getting-started).
- Install the official openui5 grunt plugin: [`npm install grunt-openui5 --save-dev`](https://github.com/SAP/grunt-openui5).
- Now you have all the tools necessary, you just need to tell grunt what it has to do. You should create a [Gruntfile.js](https://gruntjs.com/sample-gruntfile) in the root of your project. In this file you should configure the grunt openui5 task as described in the official github page (I linked it above). You can find a similar file [here](https://github.com/serban-petrescu/serban-petrescu.github.io/blob/d282a9b1e05bd91a8dc8ec7c4304c591bc02257d/Gruntfile.js) (it has more build steps like minification and copying the result files in a separate directory).
- You can then run the grunt build by simply running `grunt <task_name>` in the console. If you registered your build task as the grunt default task (like in the sample file: `grunt.registerTask('default', [...]);`) then you just have to write `grunt`. 
- I think you should be able to integrate such a command line script (i.e. to run `grunt`) inside your IDE as [an external tool](http://wiki.netbeans.org/ExternalTools).

​

1. 您可以使用非官方的gulp-openui5工具来生成它。如果您还没有在构建中使用gulp (因为它不是SAP构建的工具)，我就不推荐这样做。这个过程是一样的，但是使用gulp来构建应用程序而不是grunt (所以您需要安装节点、npm init、安装gulp、创建Gulpfile等等)。

请注意，对于大多数上述方法，您需要nodejs，您可以从这里下载和安装nodejs：https://nodejs.org/en/download/。