Docs: Announce both ESM and CommonJS imports are supported, change all examples to ESM imports

Author: PetrLaskevic

acorn-loose/README.md

@@ -49,7 +49,7 @@ placeholders in places where it can't make sense of the input. Depends
 on the `acorn` package, because it uses the same tokenizer.
 
 ```javascript
-var acornLoose = require("acorn-loose");
+import * as acornLoose from "acorn-loose";
 console.log(acornLoose.parse("1 / * 4 )[2]", {ecmaVersion: 2020}));
 ```
 

acorn-walk/README.md

@@ -47,29 +47,29 @@ produce a meaningful state. (An example of a use of state is to track
 scope at each point in the tree.)
 
 ```js
-const acorn = require("acorn")
-const walk = require("acorn-walk")
+import * as acorn from "acorn";
+import * as walk from "acorn-walk";
 
 walk.simple(acorn.parse("let x = 10"), {
   Literal(node) {
-    console.log(`Found a literal: ${node.value}`)
+    console.log(`Found a literal: ${node.value}`);
   }
-})
+});
 ```
 
 **ancestor**`(node, visitors, base, state)` does a 'simple' walk over
 a tree, building up an array of ancestor nodes (including the current node)
 and passing the array to the callbacks as a third parameter.
 
 ```js
-const acorn = require("acorn")
-const walk = require("acorn-walk")
+import * as acorn from "acorn";
+import * as walk from "acorn-walk";
 
 walk.ancestor(acorn.parse("foo('hi')"), {
   Literal(_node, _state, ancestors) {
-    console.log("This literal's ancestors are:", ancestors.map(n => n.type))
+    console.log("This literal's ancestors are:", ancestors.map(n => n.type));
   }
-})
+});
 ```
 
 **recursive**`(node, state, functions, base)` does a 'recursive'
@@ -97,12 +97,12 @@ current node) and passing the array to the callbacks as a third
 parameter.
 
 ```js
-const acorn = require("acorn")
-const walk = require("acorn-walk")
+import * as acorn from "acorn";
+import * as walk from "acorn-walk";
 
 walk.full(acorn.parse("1 + 1"), node => {
-  console.log(`There's a ${node.type} node at ${node.ch}`)
-})
+  console.log(`There's a ${node.type} node at ${node.ch}`);
+});
 ```
 
 **findNodeAt**`(node, start, end, test, base, state)` tries to locate

acorn/README.md

@@ -26,6 +26,24 @@ git clone https://github.com/acornjs/acorn.git
 cd acorn
 npm install
 ```
+## Importing acorn
+
+ESM as well as CommonJS is supported for all 3: `acorn`, `acorn-walk` and `acorn-loose`.
+
+ESM example for `acorn`:
+
+```js
+import * as acorn from "acorn";
+```
+
+CommonJS example for `acorn`:
+
+```js
+let acorn = require("acorn");
+```
+
+ESM is preferred, as it allows better editor auto-completions by offering TypeScript support.
+For this reason, following examples will use ESM imports.
 
 ## Interface
 
@@ -36,7 +54,7 @@ syntax tree object as specified by the [ESTree
 spec](https://github.com/estree/estree).
 
 ```javascript
-let acorn = require("acorn");
+import * as acorn from "acorn";
 console.log(acorn.parse("1 + 1", {ecmaVersion: 2020}));
 ```