DXP fixpack 31: where is my custom theme?

[6年前 に Alessandro Candini によって更新されました。]

Hi everyone.
In Liferay 7 DXP, I were used to find my custom theme inside the Liferay JavaScript object using

Liferay.MAPS['my-custom-theme']

After the installation of fixpack 31 this does not work anymore: it returns undefined.
Is this feature has been moved somewhere else inside the Liferay object? If so, where?

Thank you.

[6年前 に Chema Balsas によって更新されました。]

Hey Alessandro!

I think that might have happened after a security fix. Modules not exposing additional modules that needed to be loaded by the AMD Loader are no longer printed out to avoid leaking information.

What was your use case for that?

[6年前 に Alessandro Candini によって更新されました。]

I used that to retrieve my theme version:

Liferay.MAPS['my-custom-theme']

returns

my-custom-theme@1.7.3

In this way I know which version of the theme I'm running.
The version number is obviously the one inside the package.json of the theme.
Where can I find the same information via JavaScript now?

[6年前 に Chema Balsas によって更新されました。]

Hey Alessandro, one option is to add a `.es.js` placeholder file with some bogus import/export syntax so you would have that back in the MAPS object. Keep in mind that this is not meant to be used as an API for that, so it is only temporary and prone to change.

If you wanted to use it safely, you'd need to expose this information yourself, tapping into your bundle information somehow.

[6年前 に Alessandro Candini によって更新されました。]

Ok...ideally I would like to have the package.json version number as a variable in my main.js, in order to put it somewhere inside the Liferay JavaScript object.

Any suggestion to do something like that?

[6年前 に Ivan Zaera によって更新されました。]

Hi Alessandro:

In your case, I would do what you propose: creating a JS file with a variable containing the data you want to have available in the browser. The only caveat is that, given that your version number will change with the time, you should create some kind of automated process to have that number synchronized.

For example, you could set up a task to replace some token by the version number in your JS file during the build. I think there are standard plugins for that in maven and gradle.

Cheers,
Ivan

[6年前 に Alessandro Candini によって更新されました。]

I've solved hacking my gulpfile.js a little bit:

const gulp = require('gulp');
const liferayThemeTasks = require('liferay-theme-tasks');

const shell = require('gulp-shell');
const replace = require('gulp-replace');

const themeVersion = require('./package.json').version;

liferayThemeTasks.registerTasks({
  gulp: gulp,
  hookFn: function(gulp) {
    gulp.hook('before:build:war', function(done) {

      gulp.src(['src/js/config/config.js'])
        .pipe(replace(/THEME_VERSION/g, `'${themeVersion}'`))
        .pipe(gulp.dest('build/js/config/'));
      done();
    });
  } // hookFn()
});

My src/js/config/config.js is:

Liferay.on('SPAReady', function () {
  Liferay.myThemeVersion = THEME_VERSION;
});