feat: integrate with remark plugins without remark-lint, close #19 (#48)

mdx-js · Aug 21, 2019 · 4b50e27 · 4b50e27
1 parent f0b3465
commit 4b50e27
Show file tree

Hide file tree

Showing 16 changed files with 958 additions and 33 deletions.
diff --git a/README.md b/README.md
@@ -24,8 +24,26 @@
 
 > [ESLint] Parser/Plugin for [MDX], helps you lint all ES syntaxes excluding `code` block of course.
 > Work perfectly with `eslint-plugin-import`, `eslint-plugin-prettier` or any other eslint plugins.
+> And also can be integrated with [remark] plugins to lint non ES syntaxes.
 
-## VSCode Extension [![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/JounQin.vscode-mdx)](https://marketplace.visualstudio.com/items?itemName=JounQin.vscode-mdx)
+## TOC <!-- omit in toc -->
+
+- [VSCode Extension](#vscode-extension)
+- [Packages](#packages)
+- [Install](#install)
+- [Usage](#usage)
+- [Parser Options](#parser-options)
+- [Rules](#rules)
+  - [mdx/no-jsx-html-comments](#mdxno-jsx-html-comments)
+  - [mdx/no-unescaped-entities](#mdxno-unescaped-entities)
+  - [mdx/no-unused-expressions](#mdxno-unused-expressions)
+  - [mdx/remark](#mdxremark)
+- [Changelog](#changelog)
+- [License](#license)
+
+## VSCode Extension
+
+[![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/JounQin.vscode-mdx)](https://marketplace.visualstudio.com/items?itemName=JounQin.vscode-mdx)
 
 [VSCode MDX]\: Integrates with [VSCode ESLint], syntaxes highlighting and error reporting.
 
@@ -110,7 +128,7 @@ npm i -D eslint-plugin-mdx
 
 ### mdx/no-jsx-html-comments
 
-HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
+_Fixable_: HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
 
 ### mdx/no-unescaped-entities
 
@@ -120,28 +138,30 @@ Inline JSX like `Inline <Component />` is supported by [MDX], but rule `react/no
 
 [MDX] can render `jsx` block automatically without exporting them, but [ESLint] will report `no-unused-expressions` issue which could be unexpected, this rule is a replacement of it, so make sure that you've turned off the original `no-unused-expressions` rule.
 
-## Limitation
+### mdx/remark
 
-> This parser/plugin can only handle ES syntaxes for you, markdown related syntaxes will just be ignored, you can use [markdownlint] or [remark-lint] to lint that part.
+_possible fixable depends on your remark plugins_:
 
-I have a very preliminary idea to integrate with [remark-lint].
+Integration with [remark] plugins without [remark-lint], it will read [remark's configuration](https://github.com/remarkjs/remark/tree/master/packages/remark-cli#remark-cli) automatically via [cosmiconfig]. But `.remarkignore` will not be respected, you should use `.eslintignore` instead.
 
 ## Changelog
 
 Detailed changes for each release are documented in [CHANGELOG.md](./CHANGELOG.md).
 
 ## License
 
-[MIT] © [JounQin]@[1stG]
+[MIT] © [JounQin]@[1stG.me]
 
-[1stg]: https://www.1stg.me
+[1stg.me]: https://www.1stg.me
+[cosmiconfig]: https://github.com/davidtheclark/cosmiconfig
 [eslint]: https://eslint.org
 [eslint-plugin-react]: https://github.com/yannickcr/eslint-plugin-react
 [jounqin]: https://github.com/JounQin
 [lerna]: https://github.com/lerna/lerna
 [mdx]: https://github.com/mdx-js/mdx
 [mit]: http://opensource.org/licenses/MIT
 [markdownlint]: https://github.com/markdownlint/markdownlint
+[remark]: https://github.com/remarkjs/remark
 [remark-lint]: https://github.com/remarkjs/remark-lint
 [vscode eslint]: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
 [vscode mdx]: https://github.com/rx-ts/vscode-mdx
diff --git a/lerna.json b/lerna.json
@@ -1,6 +1,6 @@
 {
   "$schema": "http://json.schemastore.org/lerna",
-  "version": "0.11.2",
+  "version": "1.1.0",
   "npmClient": "yarn",
   "useWorkspaces": true,
   "changelog": {

diff --git a/package.json b/package.json
@@ -24,6 +24,7 @@
     "@1stg/tsconfig": "^0.1.0",
     "@babel/core": "^7.5.5",
     "@commitlint/config-conventional": "^8.1.0",
+    "@types/cosmiconfig": "^5.0.3",
     "@types/eslint": "^6.1.0",
     "@types/jest": "^24.0.18",
     "@types/node": "^12.7.2",
@@ -44,6 +45,8 @@
     "lint-staged": "^9.2.3",
     "prettier": "1.18.2",
     "react": "^16.9.0",
+    "remark-preset-lint-markdown-style-guide": "^2.1.3",
+    "remark-preset-lint-recommended": "^3.0.3",
     "ts-jest": "^24.0.2",
     "ts-node": "^8.3.0",
     "type-coverage": "^2.2.0",
@@ -76,6 +79,16 @@
     "preset": "ts-jest"
   },
   "prettier": "@1stg/prettier-config",
+  "remarkConfig": {
+    "settings": {
+      "emphasis": "*",
+      "strong": "*"
+    },
+    "plugins": [
+      "remark-preset-lint-recommended",
+      "remark-preset-lint-markdown-style-guide"
+    ]
+  },
   "renovate": {
     "extends": [
       "@1stg"

diff --git a/packages/eslint-mdx/README.md b/packages/eslint-mdx/README.md
@@ -24,8 +24,26 @@
 
 > [ESLint] Parser/Plugin for [MDX], helps you lint all ES syntaxes excluding `code` block of course.
 > Work perfectly with `eslint-plugin-import`, `eslint-plugin-prettier` or any other eslint plugins.
+> And also can be integrated with [remark] plugins to lint non ES syntaxes.
 
-## VSCode Extension [![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/JounQin.vscode-mdx)](https://marketplace.visualstudio.com/items?itemName=JounQin.vscode-mdx)
+## TOC <!-- omit in toc -->
+
+- [VSCode Extension](#vscode-extension)
+- [Packages](#packages)
+- [Install](#install)
+- [Usage](#usage)
+- [Parser Options](#parser-options)
+- [Rules](#rules)
+  - [mdx/no-jsx-html-comments](#mdxno-jsx-html-comments)
+  - [mdx/no-unescaped-entities](#mdxno-unescaped-entities)
+  - [mdx/no-unused-expressions](#mdxno-unused-expressions)
+  - [mdx/remark](#mdxremark)
+- [Changelog](#changelog)
+- [License](#license)
+
+## VSCode Extension
+
+[![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/JounQin.vscode-mdx)](https://marketplace.visualstudio.com/items?itemName=JounQin.vscode-mdx)
 
 [VSCode MDX]\: Integrates with [VSCode ESLint], syntaxes highlighting and error reporting.
 
@@ -110,7 +128,7 @@ npm i -D eslint-plugin-mdx
 
 ### mdx/no-jsx-html-comments
 
-HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
+_Fixable_: HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
 
 ### mdx/no-unescaped-entities
 
@@ -120,28 +138,30 @@ Inline JSX like `Inline <Component />` is supported by [MDX], but rule `react/no
 
 [MDX] can render `jsx` block automatically without exporting them, but [ESLint] will report `no-unused-expressions` issue which could be unexpected, this rule is a replacement of it, so make sure that you've turned off the original `no-unused-expressions` rule.
 
-## Limitation
+### mdx/remark
 
-> This parser/plugin can only handle ES syntaxes for you, markdown related syntaxes will just be ignored, you can use [markdownlint] or [remark-lint] to lint that part.
+_possible fixable depends on your remark plugins_:
 
-I have a very preliminary idea to integrate with [remark-lint].
+Integration with [remark] plugins without [remark-lint], it will read [remark's configuration](https://github.com/remarkjs/remark/tree/master/packages/remark-cli#remark-cli) automatically via [cosmiconfig]. But `.remarkignore` will not be respected, you should use `.eslintignore` instead.
 
 ## Changelog
 
 Detailed changes for each release are documented in [CHANGELOG.md](./CHANGELOG.md).
 
 ## License
 
-[MIT] © [JounQin]@[1stG]
+[MIT] © [JounQin]@[1stG.me]
 
-[1stg]: https://www.1stg.me
+[1stg.me]: https://www.1stg.me
+[cosmiconfig]: https://github.com/davidtheclark/cosmiconfig
 [eslint]: https://eslint.org
 [eslint-plugin-react]: https://github.com/yannickcr/eslint-plugin-react
 [jounqin]: https://github.com/JounQin
 [lerna]: https://github.com/lerna/lerna
 [mdx]: https://github.com/mdx-js/mdx
 [mit]: http://opensource.org/licenses/MIT
 [markdownlint]: https://github.com/markdownlint/markdownlint
+[remark]: https://github.com/remarkjs/remark
 [remark-lint]: https://github.com/remarkjs/remark-lint
 [vscode eslint]: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
 [vscode mdx]: https://github.com/rx-ts/vscode-mdx
diff --git a/packages/eslint-mdx/package.json b/packages/eslint-mdx/package.json
@@ -1,6 +1,6 @@
 {
   "name": "eslint-mdx",
-  "version": "0.11.2",
+  "version": "1.1.0",
   "description": "ESLint Parser for MDX",
   "repository": "git@github.com:rx-ts/eslint-mdx.git",
   "author": "JounQin <admin@1stg.me>",

diff --git a/packages/eslint-mdx/src/parser.ts b/packages/eslint-mdx/src/parser.ts
@@ -108,6 +108,7 @@ export class Parser {
             const endLineOffset = endLines.length - 1
             comments.push({
               fixed,
+              // ! eslint ast column is 0-indexed, but unified is 1-indexed
               loc: {
                 start: {
                   line: line + startLineOffset,
@@ -157,6 +158,7 @@ export class Parser {
       comments: [],
       tokens: [],
     }
+
     this._services = {
       JSXElementsWithHTMLComments: [],
     }

diff --git a/packages/eslint-plugin-mdx/README.md b/packages/eslint-plugin-mdx/README.md
@@ -24,8 +24,26 @@
 
 > [ESLint] Parser/Plugin for [MDX], helps you lint all ES syntaxes excluding `code` block of course.
 > Work perfectly with `eslint-plugin-import`, `eslint-plugin-prettier` or any other eslint plugins.
+> And also can be integrated with [remark] plugins to lint non ES syntaxes.
 
-## VSCode Extension [![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/JounQin.vscode-mdx)](https://marketplace.visualstudio.com/items?itemName=JounQin.vscode-mdx)
+## TOC <!-- omit in toc -->
+
+- [VSCode Extension](#vscode-extension)
+- [Packages](#packages)
+- [Install](#install)
+- [Usage](#usage)
+- [Parser Options](#parser-options)
+- [Rules](#rules)
+  - [mdx/no-jsx-html-comments](#mdxno-jsx-html-comments)
+  - [mdx/no-unescaped-entities](#mdxno-unescaped-entities)
+  - [mdx/no-unused-expressions](#mdxno-unused-expressions)
+  - [mdx/remark](#mdxremark)
+- [Changelog](#changelog)
+- [License](#license)
+
+## VSCode Extension
+
+[![Visual Studio Marketplace Version](https://img.shields.io/visual-studio-marketplace/v/JounQin.vscode-mdx)](https://marketplace.visualstudio.com/items?itemName=JounQin.vscode-mdx)
 
 [VSCode MDX]\: Integrates with [VSCode ESLint], syntaxes highlighting and error reporting.
 
@@ -110,7 +128,7 @@ npm i -D eslint-plugin-mdx
 
 ### mdx/no-jsx-html-comments
 
-HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
+_Fixable_: HTML style comments in jsx block is invalid, this rule will help you to fix it by transforming it to JSX style comments.
 
 ### mdx/no-unescaped-entities
 
@@ -120,28 +138,30 @@ Inline JSX like `Inline <Component />` is supported by [MDX], but rule `react/no
 
 [MDX] can render `jsx` block automatically without exporting them, but [ESLint] will report `no-unused-expressions` issue which could be unexpected, this rule is a replacement of it, so make sure that you've turned off the original `no-unused-expressions` rule.
 
-## Limitation
+### mdx/remark
 
-> This parser/plugin can only handle ES syntaxes for you, markdown related syntaxes will just be ignored, you can use [markdownlint] or [remark-lint] to lint that part.
+_possible fixable depends on your remark plugins_:
 
-I have a very preliminary idea to integrate with [remark-lint].
+Integration with [remark] plugins without [remark-lint], it will read [remark's configuration](https://github.com/remarkjs/remark/tree/master/packages/remark-cli#remark-cli) automatically via [cosmiconfig]. But `.remarkignore` will not be respected, you should use `.eslintignore` instead.
 
 ## Changelog
 
 Detailed changes for each release are documented in [CHANGELOG.md](./CHANGELOG.md).
 
 ## License
 
-[MIT] © [JounQin]@[1stG]
+[MIT] © [JounQin]@[1stG.me]
 
-[1stg]: https://www.1stg.me
+[1stg.me]: https://www.1stg.me
+[cosmiconfig]: https://github.com/davidtheclark/cosmiconfig
 [eslint]: https://eslint.org
 [eslint-plugin-react]: https://github.com/yannickcr/eslint-plugin-react
 [jounqin]: https://github.com/JounQin
 [lerna]: https://github.com/lerna/lerna
 [mdx]: https://github.com/mdx-js/mdx
 [mit]: http://opensource.org/licenses/MIT
 [markdownlint]: https://github.com/markdownlint/markdownlint
+[remark]: https://github.com/remarkjs/remark
 [remark-lint]: https://github.com/remarkjs/remark-lint
 [vscode eslint]: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
 [vscode mdx]: https://github.com/rx-ts/vscode-mdx
diff --git a/packages/eslint-plugin-mdx/package.json b/packages/eslint-plugin-mdx/package.json
@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-mdx",
-  "version": "0.11.2",
+  "version": "1.1.0",
   "description": "ESLint Plugin for MDX",
   "repository": "git@github.com:rx-ts/eslint-mdx.git",
   "author": "JounQin <admin@1stg.me>",
@@ -22,7 +22,9 @@
     "eslint-plugin-react": ">=7.0.0"
   },
   "dependencies": {
-    "eslint-mdx": "^0.11.2",
-    "rebass": "^4.0.2"
+    "cosmiconfig": "^5.2.1",
+    "eslint-mdx": "^1.1.0",
+    "rebass": "^4.0.2",
+    "remark-stringify": "^7.0.2"
   }
 }
diff --git a/packages/eslint-plugin-mdx/src/configs/recommended.ts b/packages/eslint-plugin-mdx/src/configs/recommended.ts
@@ -6,6 +6,7 @@ export const recommended = {
     'mdx/no-jsx-html-comments': 2,
     'mdx/no-unescaped-entities': 1,
     'mdx/no-unused-expressions': 2,
+    'mdx/remark': 1,
     'no-unused-expressions': 0,
     'react/no-unescaped-entities': 0,
   },

diff --git a/packages/eslint-plugin-mdx/src/rules/index.ts b/packages/eslint-plugin-mdx/src/rules/index.ts
@@ -1,13 +1,15 @@
 import { noJsxHtmlComments } from './no-jsx-html-comments'
 import { noUnescapedEntities } from './no-unescaped-entities'
 import { noUnusedExpressions } from './no-unused-expressions'
+import { remark } from './remark'
 
 export * from './types'
 
-export { noJsxHtmlComments, noUnescapedEntities, noUnusedExpressions }
+export { noJsxHtmlComments, noUnescapedEntities, noUnusedExpressions, remark }
 
 export const rules = {
   'no-jsx-html-comments': noJsxHtmlComments,
   'no-unescaped-entities': noUnescapedEntities,
   'no-unused-expressions': noUnusedExpressions,
+  remark,
 }