在React应用中使用Liferay.ThemeDisplay需导入哪个库？

首先明确：Liferay全局对象是Liferay Portal环境自动注入到window的，和AlloyUI无关，导入AlloyUI自然解决不了这个问题，下面分两种场景给出修复方案：

场景1：React应用部署在Liferay Portal内部（Portlet/Widget） #

• 直接通过window.Liferay访问，避免打包工具（如Webpack）把全局变量误判为未定义：

  if (window.Liferay?.ThemeDisplay.isSignedIn()) {
    alert(`Hello ${window.Liferay.ThemeDisplay.getUserName()}. Welcome Back.`);
  } else {
    alert('Hello Guest.');
  }
  

• 如果用Webpack打包，可配置externals让工具识别Liferay是全局变量：

  // webpack.config.js
  module.exports = {
    // 其他配置项
    externals: {
      liferay: 'Liferay'
    }
  };
  

  之后就可以在代码中通过import Liferay from 'liferay'来使用（不过直接用window.Liferay更简单）。
• 确认你的Liferay主题已加载ThemeDisplay相关脚本：默认主题都会包含，自定义主题需检查是否移除了相关依赖。

场景2：React应用独立于Liferay运行（外部应用） #

这种情况下Liferay不会自动注入全局对象，你需要通过Liferay的REST API获取用户信息：

• 调用/o/api/users/me接口获取当前登录用户数据（需处理认证，比如携带Liferay的Session Cookie或使用OAuth2令牌）。
• 示例代码（假设已处理认证）：

  fetch('/o/api/users/me', {
    credentials: 'include'
  })
  .then(res => res.json())
  .then(user => {
    if (user) {
      alert(`Hello ${user.name}. Welcome Back.`);
    } else {
      alert('Hello Guest.');
    }
  })
  .catch(err => alert('Hello Guest.'));
  

内容的提问来源于stack exchange，提问作者Gregorio Rossi