Liferay 7 / DXPでJQueryやJQuery UIなどのライブラリをコールする方法

Liferay 7 / DXPでJQuery + JQuery UIを使いたい

Liferay 7 / DXPから、Liferay標準のAUIがdeprecated宣言され、現在Metal.jsなどでLiferay本体側のコードは書かれ始めているが、まだライブラリなどが充実しておらず、依然deprecatedのAUIが利用されています。
カスタムポートレットなどで、独自にJavascriptライブラリを利用して開発したい場合、JQuery + JQuery UIなどのよくある組み合わせでライブラリをロードするにも、Liferay推奨のAMDローダーでのライブラリのロードが、グローバル定義をうまく扱えずにエラーになってしまうので、
いささか時代遅れなやり方ですが、scriptタグを利用してのライブラリのロードが必要な場合、CustomJspBagを利用した方法でロードする方法のサンプルを作成しました。

DXPを利用している人は、DE30以降は、
https://github.com/liferay/liferay-blade-samples/tree/master/gradle/apps/npm/jquery-npm-portlet
のように、npmを利用してJQueryをロードして、利用できるようになったので、こちらの方法を利用してください。

ポイントは
src/main/resources/META-INF/jsps/html/common/themes/top_js-ext.jspf の中になります。
この記事にあるように、ライブラリをglobalに露出させています。

top_js-ext.jspf

<link href="https://code.jquery.com/ui/1.12.1/themes/ui-lightness/jquery-ui.css" rel="stylesheet">  

<%-- This part enable to expose JS object to global --%>
<script>
    define._amd = define.amd;
    define.amd = false;
</script>

<script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"></script>

<%-- This part disable to expose JS object to global --%>
<script>
    define.amd = define._amd;
</script>