代码之家  ›  专栏  ›  技术社区  ›  Makwana Ketan

如何在自定义模块中覆盖HTML文件

  •  6
  • Makwana Ketan  · 技术社区  · 8 年前

    我正在为magento 2中的付款方法开发自定义模块。目前我正在使用 cc-form.html 来自vendor目录,模块工作正常。请参见下面的路径。

    供应商/magento/module payment/view/frondend/web/template/payment/cc-form.html

    有什么方法可以覆盖HTML文件吗?

    1 回复  |  直到 2 年前
        1
  •  16
  •   Anton Guz    8 年前

    是的,有。您可以在pubstatic中查看静态资产的路径是如何构造的。

    工作原理

    每个资产都可以通过它从页面访问 enter code here s“RequireJS ID”。它类似于真实的路径,但有所不同。

    例如,文件 http://magento.vg/static/adminhtml/Magento/backend/en_US/Magento_Theme/favicon.ico .

    它的真正路径是 /app/code/Magento/Theme/view/adminhtml/web/favicon.ico .
    它的RequireJS ID是 Magento_Theme/favicon.ico 。这意味着可以通过访问该文件 require("text!Magento_Theme/favicon.ico") 或类似命令。

    你可以找到 需要JS ID 与模块名称和路径的有用部分一致(在文件夹之后 web ).

    如何替换文件

    所以你有文件
    vendor/magento/module-payment/view/frontend/web/template/payment/cc-form.html

    在页面上,它加载了src as
    http://magento.vg/static/frontend/Magento/luma/en_US/Magento_Payment/template/payment/cc-form.html

    所以它的RequireJS ID是
    Magento_Payment/template/payment/cc-form.html

    旁注:在UI组件内部,它等于 Magento_Payment/payment/cc-form .自动添加单词“template”和“.html”。

    现在,您可以通过RequireJS配置为应用程序替换此文件

    var config = {
      "map": {
        "*": {
          "Magento_Payment/template/payment/cc-form.html": 
              "<OwnBrand>_<OwnModule>/template/payment/cc-form.html"
        }
      }
    };
    

    您放入的代码段 requirejs-config.js 模块中的文件。仅此而已。