jhipster - 如何创建自定义蓝图？

Question

我正在尝试为我的组织创建一个自定义的 JHipster 蓝图。

我开始了我的旅程:

1. 已安装 Yeoman v4.3.0
2. 已安装 Jhipster v7.9.3
3. 为我 future 的蓝图创建了一个目录 mkdir mygenerator && cd mygenerator
4. 执行了创建新蓝图的命令:jhipster generate-blueprint
   • 仅选择了子生成器服务器
   • 添加一个cli: Y
   • server 生成器是并排蓝图吗:是
   • server 生成器是 cli 命令吗:N
   • 选择任务:初始化、提示和配置

至此，我用VS Code打开生成的蓝图工程，发现第一个问题，部分jhipster包无法解析:

• 无法解析模块“generator-jhipster/esm/generators/server”的路径
• 无法解析模块“generator-jhipster/esm/priorities”的路径

我还注意到为我创建的生成器与 JHipster Github 中现有的生成器有细微差别，例如 jhipster-dotnetcore , generator-jhipster-quarkus , generator-jhipster-nodejs : 返回的函数是 async而在引用的 repos 中，它们是常规函数(同步):

get [INITIALIZING_PRIORITY]() {
        return {
            async initializingTemplateTask() {},
        };
    }

在这个 Jhipster 版本中有什么不同吗？或者如果我以与 jhipster-dotnetcore 相同的方式返回则没有问题。 :

get initializing() {
        return {
            ...super._initializing(),
            setupServerConsts() {
                this.packagejs = packagejs;
            ...

我假设这个细节并不重要，然后是异步函数并写下我的 prompting从用户/开发人员那里获取一些输入以替换模板文件中的值的函数:

get [PROMPTING_PRIORITY]() {
        return {
            ...super._prompting(),
            async promptingTemplateTask() {
                const choices = [
                    {
                        name: 'OAuth 2.0 Protocol',
                        value: 'oauth2',
                    },
                    {
                        name: 'CAS Protocol',
                        value: 'cas',
                    },
                ];

                const PROMPTS = {
                    type: 'list',
                    name: 'authenticationProtocol',
                    message: 'Which authentication protocol do you want to use?',
                    choices,
                    default: 'oauth2',
                };

                const done = this.async();

                if (choices.length > 0) {
                    this.prompt(PROMPTS).then(prompt => {
                        this.authenticationProtocol = this.jhipsterConfig.authenticationProtocol = prompt.authenticationProtocol;
                        done();
                    });
                } else {
                    done();
                }
            },
        };
    }

<%_ if (authenticationProtocol == 'oauth2') { _%>
    security:
        enable-csrf: true
        oauth2:
            client:
                clientId: ${this.baseName}
                clientSecret: Z3ByZXBmdGVy
                accessTokenUri: http://localhost:8443/oauth2.0/accessToken
                userAuthorizationUri: http://localhost:8443/oauth2.0/authorize
                tokenName: oauth_token
                authenticationScheme: query
                clientAuthenticationScheme: form
                logoutUri: http://localhost:8443/logout
                clientSuccessUri: http://localhost:4200/#/login-success
            resource:
                userInfoUri: http://localhost:8443/oauth2.0/profile
<%_ } _%>
    thymeleaf:
        mode: HTML

templates/src/test/java/resources/config/application.yml.ejs

所有这一切都完成了，我已经完成了接下来的步骤:

1. 运行 npm link在蓝图目录中。
2. 为应用示例创建了一个新目录:mkdir appmygenerator && cd appmygenerator
3. 使用我的蓝图启动了一个新的示例应用程序:jhipster --blueprint mygenerator --skip-git --skip-install --skip-user-management --skip-client回答所有问题。

这里有一些惊喜:

1. 回答What is the base name of your application?后我收到此警告:[DEP0148] DeprecationWarning: Use of deprecated folder mapping "./lib/util/" in the "exports" field module resolution of the package at /...<my-generator-path>/node_modules/yeoman-environment/package.json. Update this package.json to use a subpath pattern like "./lib/util/*"
2. 我的提示功能以某种方式重复了一些问题，来自问题 Do you want to make it reactive with Spring WebFlux?直到 Which other technologies would you like to use? .
3. 当我的提示最终显示时，最后一个选项前面有一条消息:CAS Protocol Run-async wrapped function (sync) returned a promise but async() callback must be executed to resolve

我对提示功能做了一些更改:删除了 super._prompting() 的调用希望解决第 2 项，并删除了 async希望解决第3项。

嗯……显然已经解决了。但是当 JHipster(或 Yeoman)尝试处理模板时我得到一个新错误:

 An error occured while running jhipster:server#writeFiles
ERROR! /home/fabianorodrigo/Downloads/my-blueprint/generators/server/templates/src/test/resources/config/application.yml.ejs:47
    45|         favicon:
    46|             enabled: false
 >> 47| <%_ if (authenticationProtocol == 'oauth2') { _%>
    48|     security:
    49|         enable-csrf: true
    50|         oauth2:

authenticationProtocol is not defined

为什么未定义 authenticationProtocol？我被困在这里了。我注意到的是，在我上面引用的所有 Jhipster 生成器中，提示函数设置属性，如“this.[property] = [value]”和“this.jhipsterConfig.[property] = [value] "并且在模板中引用了它们(只是属性的名称)并且它有效。

我错过了什么？为什么即使我在提示的函数中设置了属性“this.authenticationProtocol”，它也没有出现在模板中？

Answer 1

• Yeoman (yo/yeoman-generator/yeoman-environment) 不是必需的，也不应该是一个依赖项，以避免依赖树中的重复，除非你知道你在做什么。 JHipster 自定义它们，yeoman-test 是测试所必需的。
• 无法解析模块路径 是 bug at eslint-plugin-import
• 我还注意到，为我创建的生成器与 JHipster Github 中现有的生成器(例如 jhipster-dotnetcore、generator-jhipster-quarkus、generator-jhipster-nodejs)有细微差别。这些蓝图很旧(蓝图支持对于 v8/esm 的变化非常快)并且是完整的服务器/后端替代品，看来您正在尝试添加 cas 支持。用例完全不同。
• 在这个 Jhipster 版本中是否有任何区别，或者如果我以与 jhipster-dotnetcore 相同的方式返回则没有问题？ 是的，get [INITIALIZING_PRIORITY]()是新的表示法，INITIALIZING_PRIORITY 可能是 >initializing 而不是 initializing。解释是here . JHipster v8 将不支持旧的表示法。
• ...super._prompting(), 用于询问原始提示，因为这是一个 side-by-side blueprint , 提示将被复制。
• [DEP0148] DeprecationWarning:使用已弃用的文件夹映射“./lib/util/” 是 yeoman 环境中的错误，应在下一版本中修复。
• CAS Protocol Run-async wrapped function (sync) returned a promise but async() callback must be executed to resolve 因为您正在使用带有 const done = this 的异步函数。异步()； done(); 在一起。this.async() 是在 Promises 成为 js 默认值之前通过回调支持异步。

有一些使用新符号的蓝图可以用作灵感:native , ionic , jooq和 entity-audit .

我没有看到任何关于写入优先级的信息，所以看起来您正在覆盖现有模板，而原始生成器将写入它。因此，您应该将配置注入(inject)原始生成器。

最终结果应该是这样的:

    get [INITIALIZING_PRIORITY]() {
        return {
            async initializingTemplateTask() {
                this.info('this blueprint adds support to cas authentication protocol');
            },
        };
    }

    get [PROMPTING_PRIORITY]() {
        return {
            async promptingTemplateTask() {
                await this.prompt({
                    type: 'list',
                    name: 'authenticationProtocol',
                    message: 'Which authentication protocol do you want to use?',
                    choices: [
                        {
                            name: 'OAuth 2.0 Protocol',
                            value: 'oauth2',
                        },
                        {
                            name: 'CAS Protocol',
                            value: 'cas',
                        },
                    ],
                    default: 'oauth2',
                }, this.blueprintStorage); // <- `this.blueprintStorage` tells the prompt function to store the configuration inside `.yo-rc.json` at the blueprint namespace.
            },
        };
    }

    get [CONFIGURING_PRIORITY]() {
        return {
            configuringTemplateTask() {
                // Store the default configuration
                this.blueprintConfig.authenticationProtocol = this.blueprintConfig.authenticationProtocol || 'oauth2';
            },
        };
    }

    get [LOADING_PRIORITY]() {
        return {
            loadingTemplateTask() {
                // Load the stored configuration, the prompt can be skipped so this needs to be in another priority.
                this.authenticationProtocol = this.blueprintConfig.authenticationProtocol;

                // Inject the configuration into the original generator. If you are writing the template by yourself, this may be not necessary.
                this.options.jhipsterContext.authenticationProtocol = this.blueprintConfig.authenticationProtocol;
            },
        };
    }