Liferay Frontend NPM Toolkit compatibility matrix for Node.js, NPM, Yeoman, Gulp and Generator Liferay Theme

Issue

• If a client wants to generate custom themes, they need to install:
  • Node.js and NPM
  • Yeoman
  • Gulp
  • generator-liferay-theme
• As a result, it is difficult to know which version to install depending on the portal version you use, and we don't have a specific compatibility matrix to cover all of them.

Environment

• DXP 7.0 or higher

Resolution

• Although we can collect that information from different sources.
  • Node Version Information - Compatibility Matrix Article in Help Center provides info about Liferay DXP - Node - NPM to use.
  • Liferay Frontend Projects' Readme provides information about Liferay DXP - Generator Liferay Theme - Gulp. It is important to notice that Generator Liferay Themes (since v.9.x.x) already includes the right version of Gulp, so you can use the one it gets installed locally with npm install inside your node_modules. You can do this by adding a new script inside your package.json like this "gulp": "gulp"
    For example, your scrips inside your package.json file would look like this:
    

    {
    "scripts": {
    		"gulp": "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"
    	}
      }

    In order to use it to build your theme, just run npm run gulp init and npm run gulp build.
  • Checking yeoman's source code project we can see that you need Node 6.x.x in Yeoman 2.x, Node 8.x.x in Yeoman 3.x and Node 12.10.x in Yeoman 4.x;
• As a result, we have this compatibility matrix that covers all of them:

  Liferay Version	Node	NPM	generator-liferay-theme	Gulp	Yeoman
  Liferay DXP 7.0	6.6.0	6.4.1	8.x.x	2.x	2.x
  Liferay DXP 7.1	8.15.0	6.4.1	8.x.x	2.x	3.x
  Liferay DXP 7.2	10.15.3	6.4.1	9.x.x & 10.x.x	3.x & 4.x	3.x
  Liferay DXP 7.3	10.15.3	6.4.1	9.x.x & 10.x.x	3.x & 4.x	3.x
  Liferay DXP 7.4	16.13.0	8.1.0	10.2.x	4.x	4.x

• Note: If for DXP 7.2 or 7.3 your theme uses generator-liferay-theme 9.x.x as explained before already comes with the correct gulp 3.x version and if you use generator-liferay-theme 10.x.x it will be gulp 4.x version.