如何在 Magento 2 中扩展 .js 和 .html 文件

Question

我正在延长 customer address 对于这些我必须 修改/扩展 vendor/Magento/module-ui 核心文件。

IE

root/vendor/magento/module-ui/view/base/web/js/form/components/collection.js

和

root/vendor/magento/module-ui/view/base/web/templates/form/components/collection.html

当我修改核心文件时，它工作正常，但这不是一个好的扩展过程/想法。

所以我将供应商名称创建为 Magento 在 root/app/code/ 我已将修改后的上述文件放置到本地的同一文件夹中。

IE

root/app/code/magento/module-ui/view/base/web/js/form/components/collection.js

和

root/app/code/magento/module-ui/view/base/web/templates/form/components/collection.html

放置这些文件后，我清除了缓存。但它仍然没有显示我的更改。

我已经跑了 php bin/magento setup:static-content:deploy 也有命令但没有运气。

你能建议我该怎么做吗？

Answer 1

终于成就了自己。

创造 requirejs-config.js 文件来自 学习/HelloWorld/视图/基础 并粘贴下面的代码

var config = {
    map: {
        '*': {
            'Magento_Ui/js/form/components/collection':'Learning_HelloWorld/js/form/components/collection'
        }
    }
};

创造 collection.js 文件来自 学习/HelloWorld/view/base/web/js/form/components 并复制粘贴核心代码并对其进行修改。

   /**
     * Copyright © 2015 Magento. All rights reserved.
     * See COPYING.txt for license details.
     */
    define([
        'underscore',
        'mageUtils',
        'uiRegistry',
        'uiComponent',
        'uiLayout',
        'Magento_Ui/js/modal/confirm'
    ], function (_, utils, registry, Component, layout, confirm) {
        'use strict';

        var childTemplate = {
            parent: '${ $.$data.name }',
            name: '${ $.$data.childIndex }',
            dataScope: '${ $.name }',
            nodeTemplate: '${ $.$data.name }.${ $.$data.itemTemplate }'
        };

        return Component.extend({
            defaults: {
                lastIndex: 0,
                template: 'Learning_HelloWorld/form/components/collection'
            },

/* my custom methods */
            sendAddress: function (elem) {
                var self = this;
                self._sendAddress(elem);
            },

/* my custom methods */
            _sendAddress: function (elem) {


                this.bubble('update');
            }

        });
    });

创造 collection.html 文件来自 学习/HelloWorld/view/base/web/template/form/components 路径并粘贴核心代码并修改

   <div class="ui-tabs">
<!-- My Extra html code -->
     <button type="button" data-bind="click: $parent.sendAddress.bind($parent, element)">
         Send this Address
     </button>
    </div>

现在运行以下命令。

1. 设置：升级
2. 设置：静态内容：部署

现在它会起作用了。

如有任何疑问，请随时询问。

Answer 2

一个模块注册在一个路径下，这就是为什么它可以从供应商读取，但不能从应用程序/代码读取。