Improve documents (#25)

* Improve documents

* Improve documents

Author: ota-meshi

.env-cmdrc

@@ -0,0 +1,5 @@
+{
+  "version": {
+    "IN_VERSION_SCRIPT": "true"
+  }
+}

docs/.vuepress/.eslintrc.js

@@ -0,0 +1,15 @@
+"use strict"
+
+module.exports = {
+    overrides: [
+        {
+            files: ["enhanceApp.mjs"],
+            parserOptions: {
+                sourceType: "module",
+            },
+            globals: {
+                window: false,
+            },
+        },
+    ],
+}

docs/.vuepress/components/eslint-playground.vue

@@ -7,7 +7,7 @@
         :class="`eslint-playground-${type}`"
         class="eslint-playground"
         dark
-        fix
+        :fix="fix"
     />
 </template>
 
@@ -20,9 +20,13 @@ export default {
     components: { EslintEditor },
 
     props: {
+        // For no-json-superset
         code: {
             type: String,
-            required: true,
+            default: undefined,
+        },
+        fix: {
+            type: Boolean,
         },
         type: {
             type: String,
@@ -89,16 +93,21 @@ export default {
 
     computed: {
         cookedCode() {
-            return (this.code || "").replace(
-                /&#x([0-9a-zA-Z]+);/gu,
-                (_, codePoint) => String.fromCodePoint(parseInt(codePoint, 16)),
-            )
+            if (this.code && this.code.trim()) {
+                return (this.code || "").replace(
+                    /&#x([0-9a-zA-Z]+);/gu,
+                    (_, codePoint) =>
+                        String.fromCodePoint(parseInt(codePoint, 16)),
+                )
+            }
+
+            return `${computeCodeFromSlot(this.$slots.default).trim()}\n`
         },
     },
 
     async mounted() {
         // Load linter.
-        const { default: Linter } = await import("eslint4b/dist/linter")
+        const { Linter } = await import("eslint/lib/linter")
         const linter = (this.linter = new Linter())
 
         for (const ruleId of Object.keys(rules)) {
@@ -131,6 +140,19 @@ export default {
         },
     },
 }
+
+/**
+ * @param {VNode[]} nodes
+ * @returns {string}
+ */
+function computeCodeFromSlot(nodes) {
+    if (!Array.isArray(nodes)) {
+        return ""
+    }
+    return nodes
+        .map((node) => node.text || computeCodeFromSlot(node.children))
+        .join("")
+}
 </script>
 
 <style>

docs/.vuepress/config.js

@@ -4,6 +4,7 @@
  */
 "use strict"
 
+const path = require("path")
 const { categories } = require("../../scripts/rules")
 require("../../scripts/update-docs-readme")
 
@@ -13,6 +14,27 @@ module.exports = {
     description: "ESLint plugin about ECMAScript syntax.",
     evergreen: true,
 
+    enhanceAppFiles: require.resolve("./enhanceApp.mjs"),
+    configureWebpack(_config, _isServer) {
+        return {
+            externals: {
+                typescript: "typescript",
+            },
+            resolve: {
+                alias: {
+                    esquery: path.resolve(
+                        __dirname,
+                        "../../node_modules/esquery/dist/esquery.min.js",
+                    ),
+                    "@eslint/eslintrc/universal": path.resolve(
+                        __dirname,
+                        "../../node_modules/@eslint/eslintrc/dist/eslintrc-universal.cjs",
+                    ),
+                },
+            },
+        }
+    },
+
     themeConfig: {
         repo: "ota-meshi/eslint-plugin-es-x",
         docsRepo: "ota-meshi/eslint-plugin-es-x",

docs/.vuepress/enhanceApp.mjs

@@ -0,0 +1,18 @@
+export default ({
+    _Vue, // the version of Vue being used in the VuePress app
+    _options, // the options for the root Vue instance
+    _router, // the router instance for the app
+    _siteData, // site metadata
+}) => {
+    if (typeof window !== "undefined") {
+        if (typeof window.global === "undefined") {
+            window.global = {}
+        }
+        if (typeof window.process === "undefined") {
+            window.process = {
+                env: {},
+                cwd: () => undefined,
+            }
+        }
+    }
+}

docs/rules/no-accessor-properties.md

@@ -1,15 +1,24 @@
+---
+title: "es-x/no-accessor-properties"
+description: "disallow accessor properties"
+since: "[eslint-plugin-es] v1.1.0"
+---
+
 # es-x/no-accessor-properties
 > disallow accessor properties
 
 - ✅ The following configurations enable this rule: `plugin:es-x/no-new-in-es5` and `plugin:es-x/restrict-to-es3`
 
 This rule reports ES5 accessor properties as errors.
 
-## Examples
+## 💡 Examples
 
 ⛔ Examples of **incorrect** code for this rule:
 
-<eslint-playground type="bad" code="/*eslint es-x/no-accessor-properties: error */
+<eslint-playground type="bad">
+
+```js
+/*eslint es-x/no-accessor-properties: error */
 var a = {
     get a() {},
     set a(value) {}
@@ -18,7 +27,15 @@ class A {
     get a() {}
     set a(value) {}
 }
-" />
+```
+
+</eslint-playground>
+
+## 🚀 Version
+
+This rule was introduced in [eslint-plugin-es] v1.1.0.
+
+[eslint-plugin-es]: https://github.com/mysticatea/eslint-plugin-es
 
 ## 📚 References
 

docs/rules/no-arbitrary-module-namespace-names.md

@@ -1,19 +1,34 @@
+---
+title: "es-x/no-arbitrary-module-namespace-names"
+description: "disallow arbitrary module namespace names"
+since: "v5.0.0"
+---
+
 # es-x/no-arbitrary-module-namespace-names
 > disallow arbitrary module namespace names
 
 - ✅ The following configurations enable this rule: `plugin:es-x/no-new-in-es2022`, `plugin:es-x/restrict-to-es3`, `plugin:es-x/restrict-to-es5`, `plugin:es-x/restrict-to-es2015`, `plugin:es-x/restrict-to-es2016`, `plugin:es-x/restrict-to-es2017`, `plugin:es-x/restrict-to-es2018`, `plugin:es-x/restrict-to-es2019`, `plugin:es-x/restrict-to-es2020`, and `plugin:es-x/restrict-to-es2021`
 
 This rule reports ES2022 arbitrary module namespace names as errors.
 
-## Examples
+## 💡 Examples
 
 ⛔ Examples of **incorrect** code for this rule:
 
-<eslint-playground type="bad" code="/*eslint es-x/no-arbitrary-module-namespace-names: error */
-export * as &quot;ns&quot; from &quot;mod&quot;
-export {foo as &quot;bar&quot;} from &quot;mod&quot;
-import {&quot;foo&quot; as bar} from &quot;mod&quot;
-" />
+<eslint-playground type="bad">
+
+```js
+/*eslint es-x/no-arbitrary-module-namespace-names: error */
+export * as "ns" from "mod"
+export {foo as "bar"} from "mod"
+import {"foo" as bar} from "mod"
+```
+
+</eslint-playground>
+
+## 🚀 Version
+
+This rule was introduced in v5.0.0.
 
 ## 📚 References
 

docs/rules/no-array-from.md

@@ -1,17 +1,34 @@
+---
+title: "es-x/no-array-from"
+description: "disallow the `Array.from` method"
+since: "[eslint-plugin-es] v1.2.0"
+---
+
 # es-x/no-array-from
 > disallow the `Array.from` method
 
 - ✅ The following configurations enable this rule: `plugin:es-x/no-new-in-es2015`, `plugin:es-x/restrict-to-es3`, and `plugin:es-x/restrict-to-es5`
 
 This rule reports ES2015 `Array.from` method as errors.
 
-## Examples
+## 💡 Examples
 
 ⛔ Examples of **incorrect** code for this rule:
 
-<eslint-playground type="bad" code="/*eslint es-x/no-array-from: error */
-const array = Array.from(&quot;hello&quot;)
-" />
+<eslint-playground type="bad">
+
+```js
+/*eslint es-x/no-array-from: error */
+const array = Array.from("hello")
+```
+
+</eslint-playground>
+
+## 🚀 Version
+
+This rule was introduced in [eslint-plugin-es] v1.2.0.
+
+[eslint-plugin-es]: https://github.com/mysticatea/eslint-plugin-es
 
 ## 📚 References
 

docs/rules/no-array-isarray.md

@@ -1,17 +1,34 @@
+---
+title: "es-x/no-array-isarray"
+description: "disallow the `Array.isArray` method"
+since: "[eslint-plugin-es] v3.0.0"
+---
+
 # es-x/no-array-isarray
 > disallow the `Array.isArray` method
 
 - ✅ The following configurations enable this rule: `plugin:es-x/no-new-in-es5` and `plugin:es-x/restrict-to-es3`
 
 This rule reports ES5 `Array.isArray` method as errors.
 
-## Examples
+## 💡 Examples
 
 ⛔ Examples of **incorrect** code for this rule:
 
-<eslint-playground type="bad" code="/*eslint es-x/no-array-isarray: error */
+<eslint-playground type="bad">
+
+```js
+/*eslint es-x/no-array-isarray: error */
 var array = Array.isArray(obj)
-" />
+```
+
+</eslint-playground>
+
+## 🚀 Version
+
+This rule was introduced in [eslint-plugin-es] v3.0.0.
+
+[eslint-plugin-es]: https://github.com/mysticatea/eslint-plugin-es
 
 ## 📚 References
 

docs/rules/no-array-of.md

@@ -1,17 +1,34 @@
+---
+title: "es-x/no-array-of"
+description: "disallow the `Array.of` method"
+since: "[eslint-plugin-es] v1.2.0"
+---
+
 # es-x/no-array-of
 > disallow the `Array.of` method
 
 - ✅ The following configurations enable this rule: `plugin:es-x/no-new-in-es2015`, `plugin:es-x/restrict-to-es3`, and `plugin:es-x/restrict-to-es5`
 
 This rule reports ES2015 `Array.of` method as errors.
 
-## Examples
+## 💡 Examples
 
 ⛔ Examples of **incorrect** code for this rule:
 
-<eslint-playground type="bad" code="/*eslint es-x/no-array-of: error */
+<eslint-playground type="bad">
+
+```js
+/*eslint es-x/no-array-of: error */
 const array = Array.of(1, 2, 3)
-" />
+```
+
+</eslint-playground>
+
+## 🚀 Version
+
+This rule was introduced in [eslint-plugin-es] v1.2.0.
+
+[eslint-plugin-es]: https://github.com/mysticatea/eslint-plugin-es
 
 ## 📚 References