Sage 8.4.2 - Using js libraries installed by npm

sage
,
1

I’m working on a site using Sage 8.4.2, and the client want functionality which requires the woocommerce-api package to make JavaScript talk to WooCommerce. I know bower should be used for front-end packages with Sage 8.4, but the woocommerce-api package is only available through npm. I’ve installed woocommerce-api with the following command:

npm install --save-dev woocommerce-api

And the docs says I need to initialise the library like this(I’ve added this code to main.js:

var WooCommerceAPI = require('woocommerce-api');
 
var WooCommerce = new WooCommerceAPI({
  url: 'http://example.com',
  consumerKey: 'ck_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
  consumerSecret: 'cs_XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX',
  wpAPI: true,
  version: 'wc/v1'
});

But this give me the following error in the console

Uncaught ReferenceError: require is not defined

So my question is, how can I start using the WooCommerceAPI class with my current setup with Sage 8.4?

2

To use require / import / export you need to have something like Webpack/RollUp/Browserify to bundle up the required files and Sage 8.4.2 does not have it.

  • You can try to switch to sage 9, which has webpack by default
  • Or you can try to modify the script pipeline (personally for gulp I’d suggest using rollup) (i’ve done this here)