Support ESM import

[chriscarrollsmith]

Description

Currently, when I import js-beautifier to an ES module using an import statement and then log the object to the console, here's what I see:

import * as beautify from 'js-beautify';
console.log(beautify)

[Module: null prototype] {
default: [Function: beautify] {
js: [Function: js_beautify] { defaultOptions: [Function (anonymous)] },
css: [Function: css_beautify] { defaultOptions: [Function (anonymous)] },
html: [Function: style_html] { defaultOptions: [Function (anonymous)] },
js_beautify: [Function: js_beautify] { defaultOptions: [Function (anonymous)] },
css_beautify: [Function: css_beautify] { defaultOptions: [Function (anonymous)] },
html_beautify: [Function: style_html] { defaultOptions: [Function (anonymous)] }
}
}

Honestly not great, because it means I have to access the different beautifers through the default property, like this:

beautify.default.html()

At minimum, this needs to be added to the README so folks know the correct syntax. Preferably, the code should also be updated to better support ESM import.

[bitwiseman]

@chriscarrollsmith If you know how to update for better ESM support without breaking existing code, PR welcome.

[maxpatiiuk]

Encountered an issue with ESM support in js-beautify
My ESM browser app had a single AMD dependency (@arcgis/core), and that dependency creates the global define() function.
Even though I am importing js-beautify as ESM, the presence of define() function confuses it into thinking AMD import is desired:

js-beautify/js/index.js

Lines 67 to 69 in 0863e19

	if (typeof define === "function" && define.amd) {
	// Add support for AMD ( https://github.com/amdjs/amdjs-api/wiki/AMD#defineamd-property- )
	define([

Ideally, js-beautify would be built with separate output targets - one for CDN users (for the the script tag), and a separate one for ESM users

[bitwiseman]

@maxpatiiuk
PR welcome.