[[Magentoめも]]
#contents
*Front側 [#e37f2120]
大きく分けて2通りのやり方があるようですが、簡単なやり方でやります。~
まずは[[Magento2 themeの作成]]でテーマを作成しておきます。
**JSファイル設定 [#y33356ce]
以下のパスに default_head_blocks.xml を設置します。~
app/design/frontend/Yassujp/blank/Magento_Theme/layout/
default_head_blocks.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<link src="js/custom.js"/>
</head>
</page>
**JSの記述 [#ra7b3385]
以下のパスに custom.js を設置します。~
app/design/frontend/Yassujp/blank/web/js/
**静的ファイルのデプロイ [#s469fbb8]
以下のコマンドで静的ファイルをデプロイします。
php bin/magento cache:clean
php bin/magento setup:static-content:deploy
デプロイ先は以下になります。~
pub/static/frontend/Yassujp/blank/en_US/js/custom.js
更新されない場合は削除してしまって再度コマンドを叩きました。
# rm -fr pub/static/frontend/Yassujp/
**キャッシュファイルのクリア [#b22b1b64]
SYSTEM - Cache Management からキャッシュをクリアします。
これでJSが実行されればOKです。
[[Magento2でjQueryを使用する]]も参考にして下さい。
*Admin側 [#rc23498e]
**JSファイル設定 [#da1cdb9d]
以下のパスに default.xml を設置します。~
app/code/Yassujp/HelloWorld/view/adminhtml/layout/
default.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="admin-1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<link src="Yassujp_HelloWorld::js/custom-adminhtml.js"/>
</head>
</page>
**JSの記述 [#w1ab8c30]
以下のパスに custom-adminhtml.js を設置します。~
app/code/Yassujp/HelloWorld/view/adminhtml/web/js/
**モジュールの更新 [#yabb72a1]
以下のコマンドで更新します。
php bin/magento setup:upgrade
これでJSが実行されればOKです。
