問題
- ユーザーインターフェースのバグ（アクセシビリティやスタイルに関するものなど）を解決するために、お客様がカスタムテーマを liferay-frontend-theme-unstyled、 liferay-frontend-theme-styled、liferay-font-awesomeの最新バージョンに更新する必要がある場合があります。
- これは、これらのパッケージがリリースされるたびにさまざまなバグが修正されるためで、それらをポータルに含めるには、パッケージを更新してカスタムテーマを再生成する必要があります。
環境
- DXP 7.0 およびそれ以降のバージョン
解決策
-
最初に、DXP バージョンで利用可能な最新のテーマを使用して、
package.jsonの依存関係を更新する必要があります（liferay-theme-tasks#get-the-right-dependency-version-for-your-theme をご参照ください)。 - 例えば、最新の DXP 7.4 の場合、liferay-frontend-theme-unstyled ベースのテーマと liferay-frontend-theme-styled ベースのテーマの両方に最新のメジャー バージョン 6.x.x を使用する必要があります。 liferay-font-awesome に関しては、DXP 7.0 以降のすべてのバージョンと互換性があるため、入手可能な最新のものを使用できます。
- その結果、
package.jsonは次のようになります (この記事の公開時点で入手可能な最新のものを使用):
{...
"liferayTheme": {
"baseTheme": "styled",
"fontAwesome": true,
"templateLanguage": "ftl",
"version": "7.4"
},
"devDependencies": {
"compass-mixins": "0.12.12",
"gulp": "4.0.2",
"liferay-frontend-css-common": "6.0.5",
"liferay-frontend-theme-styled": "6.0.52",
"liferay-frontend-theme-unstyled": "6.0.45",
"liferay-theme-tasks": "11.4.0",
"liferay-font-awesome": "3.5.2"
},
"scripts": {
"gulp": "node_modules/.bin/gulp",
"init": "gulp init",
"build": "gulp build",
"deploy": "gulp deploy",
"extend": "gulp extend",
"kickstart": "gulp kickstart",
"status": "gulp status",
"upgrade": "gulp upgrade",
"watch": "gulp watch"
}
}
結果を確認するには、npm install (これにより新しいライブラリが node_modules フォルダーにダウンロードされます) と gulp deploy (これにより、新しく生成されたテーマがポータルにデプロイされ、guld ビルド が含まれます) を実行する必要があります。
新しく生成されたテーマをデプロイした後、結果や変更が表示されない場合は、ブラウザーのキャッシュ (ブラウザーごとに方法があります) とポータルのキャッシュをクリアします。 [コントロール パネル] > [サーバー管理] に移動し、[この VM によってキャッシュされたコンテンツのクリア] および [クラスター全体でキャッシュされたコンテンツのクリア] を実行します。 (詳細については、サーバー管理：リソース をご参照ください。)
重要事項: unstyled テーマの src/templates にある元のテンプレートを上書きする場合(frontend-theme-unstyled/src/main/resources/META-INF/resources/_unstyled/templates をご参照ください)、テーマが新しいバージョンで正しく機能するために、必要な変更があるかどうかを確認する必要があります。
追加情報
- DXP 7.4 以降では、サイトの外観ページの使用を推奨します。すべてのリンクは次の通りです:
- これらすべての新機能がデザインのニーズに合わない場合は、カスタムテーマを作成できます。
- Liferay Frontend NPM Toolkit の互換性マトリックス（Node.js、NPM、Yeoman、Gulp、Generator Liferayテーマ用）
- テーマを移行する際のプラグイン「sass」のエラー"... is deprecated and will be removed in Dart Sass 2.0.0."