Buat Struktur Folder Modul:
app / code / [Vendor] / [ModuleName]
app / code / [Vendor] / [ModuleName] / etc
app / code / [Vendor] / [ModuleName] / view / frontend / layout
Buat File Modul:
app / code / [Vendor] / [ModuleName] / registration.php
app / code / [Vendor] / [ModuleName] / etc / module.xml
app / code / [Vendor] / [ModuleName] / view / frontend / requirejs-config.js
app / code / [Vendor] / [ModuleName] / view / frontend / layout / default.xml
app / code / [Vendor] / [ModuleName] / view / frontend / layout / default_head_blocks.xml
registrasi.php
<?php
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE,
'[Vendor]_[ModuleName]',
__DIR__
);
module.xml
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../vendor/magento/framework/Module/etc/module.xsd">
<module name="[Vendor]_[ModuleName]" setup_version="0.0.1"/>
</config>
requireejs-config.js
var config = {
paths: {
"jquery.bootstrap": "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min"
},
shim: {
'jquery.bootstrap': {
'deps': ['jquery']
}
}
};
default.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../vendor/magento/framework/Module/etc/module.xsd">
<referenceBlock name="head">
<block class="Magento\Theme\Block\Html\Head\Script" name="requirejs" before="-">
<arguments>
<!-- RequireJs library enabled -->
<argument name="file" xsi:type="string">requirejs/require.js</argument>
</arguments>
</block>
<!-- Special block with necessary config is added on the page -->
<block class="Magento\RequireJs\Block\Html\Head\Config" name="requirejs-config" after="requirejs"/>
</referenceBlock>
</page>
default_head_blocks.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../vendor/magento/framework/Module/etc/module.xsd">
<head>
<css src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" src_type="url"/>
<css src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" src_type="url"/>
</head>
</page>
Aktifkan Modul (SSH ke magento root):
php -f bin/magento module:enable --clear-static-content [Vendor]_[ModuleName]
php -f bin/magento setup:upgrade
Menyebarkan sumber statis (SSH ke magento root):
php bin/magento setup:static-content:deploy
RequireJS tidak akan memuat file sumber modul javascript apa pun sampai seseorang menggunakan modul javascript tersebut sebagai ketergantungan. per Alan Storm
(contoh penggunaan) di Halaman CMS:
<script type="text/javascript">
requirejs(['jquery', 'jquery.bootstrap'], function (jQuery, jQueryBootstrap) {
jQuery('.carousel').carousel();
});
</script>
Terkait: Menambahkan CSS ke halaman CMS menggunakan Layout Update XML
xsi:noNamespaceSchemaLocation
nilainyadefault.xml
. Menurut saya ini bertentangan dengan semua modularitas di Magento, untuk mendefinisikan jalur seperti itu. Tapi saya melihatnya di seluruh web, jadi itu pasti cara kerjanya.