Làm cách nào để ghi đè tệp HTML bằng mô-đun tùy chỉnh?

Tôi đang phát triển một mô-đun tùy chỉnh cho phương thức thanh toán trong Magento 2. Hiện tại, tôi đang sử dụng cc-form.html từ thư mục nhà cung cấp và mô-đun hoạt động tốt. Xem đường dẫn bên dưới:

nhà cung cấp / magento / mô-đun thanh toán / xem / frontend / web / mẫu / thanh toán / cc-form.html

Có cách nào để ghi đè tệp HTML không?

Lưu ý: Tôi muốn ghi đè nó bằng tiện ích mở rộng tùy chỉnh. Xem đường dẫn bên dưới:

ứng dụng / mã / Không gian tên / Mô-đun / lượt xem / frontend / web / mẫu / thanh toán / cc-form.html

Bất kỳ trợ giúp sẽ được đánh giá cao. Cảm ơn bạn!

Giải pháp làm việc.

Chỉ cần tạo hoặc chỉnh sửa tệp requestjs-config.js từ đường dẫn bên dưới.

/app/code/Namespace/Module/view/frontend/requirejs-config.js

Và đặt mã bên dưới trong allowjs-config.js

var config = {
    map: {
        '*': {
          'Magento_Payment/template/payment/cc-form.html': 
              'Namespace_Module/template/payment/cc-form.html'
        }
  }
};

Vì vậy, chúng tôi có thể ghi đè bất kỳ tệp html nào theo cách này.

Bạn chỉ có thể thêm tệp cc-form.html bên trong mô-đun thanh toán chủ đề của mình.

<mage_dir>/app/design/frontend/{Package}/{themename}/Magento_Payment/web/template/payment/cc-form.html

Bạn có thể thay đổi theo yêu cầu của bạn ở nơi trên.

Xóa thư mục var khỏi thư mục gốc và xóa pub/static/frontendthư mục.

Bạn phải có lệnh chạy php bin/magento setup:static-content:deploy

Xóa bộ nhớ cache của trình duyệt và kiểm tra.

Giải pháp được chấp nhận là đúng, nhưng tôi sao chép ở đây toàn bộ câu trả lời @AntonGuz từ "Stack Overflow" (giải thích rất rõ):

Có, có. Bạn có thể nhìn vào quán rượu tĩnh để xem cách đường dẫn đến tài sản tĩnh được xây dựng.

Làm thế nào nó hoạt động

Mọi tài sản đều có thể truy cập được từ trang bởi enter code here"ID RequireJS". Nó tương tự như con đường thực, nhưng đa dạng.

Ví dụ tập tin http://magento.vg/static/adminhtml/Magento/backend/en_US/Magento_Theme/favicon.ico.

Đó là con đường thực sự /app/code/Magento/Theme/view/adminhtml/web/favicon.ico. Đó là ID RequireJS Magento_Theme/favicon.ico. Điều này có nghĩa là tập tin có thể được truy cập thông qua require("text!Magento_Theme/favicon.ico")hoặc lệnh tương tự.

Bạn có thể thấy ID RequireJS bao gồm tên mô-đun và phần hữu ích của đường dẫn (sau thư mụcweb ).

Làm thế nào tôi có thể thay thế một tập tin

Vì vậy, bạn có tập tin
vendor/magento/module-payment/view/frontend/web/template/payment/cc-form.html

Trên trang nó được tải với src như
http://magento.vg/static/frontend/Magento/luma/en_US/Magento_Payment/template/payment/cc-form.html

Vì vậy, ID RequireJS của nó là
Magento_Payment/template/payment/cc-form.html

Lưu ý bên lề: Bên trong các thành phần UI tương đương với Magento_Payment/payment/cc-form . Từ "mẫu" và ".html" được thêm tự động.

Và bây giờ bạn có thể thay thế tệp này cho ứng dụng thông qua cấu hình RequireJS

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

Đoạn mã này bạn đặt trong requirejs-config.jstệp trong mô-đun của bạn. Đó là tất cả.

Có lẽ nó sẽ giúp ai đó hiểu khi nó xảy ra.

Tôi không biết phiên bản nào của Magento2 là bắt buộc nhưng nếu bạn muốn ghi đè mẫu từ mô-đun Magento_Ui, bạn cần cung cấp đường dẫn như thế này:

var config = {
    map: {
        "*": {
            'ui/template/form/element/select.html':'Vendor_Module/templates/form/element/select.html'
        }
    }
};

Bởi vì trong tập tin này:

nhà cung cấp / magento / module-ui / view / base / allowjs-config.js

Có ánh xạ đường dẫn:

/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */

var config = {
    paths: {
        'ui/template': 'Magento_Ui/templates'
    },
    map: {
        '*': {
            uiElement:      'Magento_Ui/js/lib/core/element/element',
            uiCollection:   'Magento_Ui/js/lib/core/collection',
            uiComponent:    'Magento_Ui/js/lib/core/collection',
            uiClass:        'Magento_Ui/js/lib/core/class',
            uiEvents:       'Magento_Ui/js/lib/core/events',
            uiRegistry:     'Magento_Ui/js/lib/registry/registry',
            consoleLogger:  'Magento_Ui/js/lib/logger/console-logger',
            uiLayout:       'Magento_Ui/js/core/renderer/layout',
            buttonAdapter:  'Magento_Ui/js/form/button-adapter'
        }
    }
};