feat: parcel-plugin-markdown-string => parcel-transformer-markdown.

jaywcjlove · Jan 15, 2022 · 303a6bd · 303a6bd · jaywcjlove · Jan 15, 2022
1 parent 52d1234
commit 303a6bd
Show file tree

Hide file tree

Showing 16 changed files with 22,059 additions and 84 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,4 +1,9 @@
-node_modules
 .cache
+.parcel-cache
+package-lock.json
 parcel.log
-dist
+
+node_modules
+dist
+lib
+esm
diff --git a/README.md b/README.md
@@ -1,30 +1,81 @@
-## parcel-plugin-markdown-string
+parcel-transformer-markdown
+===
 
-[![parcel-plugin-markdown-string](https://img.shields.io/npm/dm/parcel-plugin-markdown-string.svg?style=flat)](https://www.npmjs.com/package/parcel-plugin-markdown-string)
+[![parcel-transformer-markdown](https://img.shields.io/npm/dm/parcel-transformer-markdown.svg?style=flat)](https://www.npmjs.com/package/parcel-transformer-markdown)
 
-> [Parcel](https://parceljs.org/) plugin for loader markdown string.
+[Parcel 2](https://parceljs.org/) plugin for loader markdown string.  
 
-### Use
+> ⚠️ ~~[parcel-plugin-markdown-string](https://www.npmjs.com/package/parcel-plugin-markdown-string)~~ => [`parcel-transformer-markdown`](https://www.npmjs.com/package/parcel-transformer-markdown)
+
+```diff
+- parcel-plugin-markdown-string 
++ parcel-transformer-markdown
+```
+
+## Example usage
 
 Install the plugin
 
 ```bash
-npm install parcel-plugin-markdown-string --save-dev
+npm install parcel-transformer-markdown --save-dev
+```
+
+`.parcelrc`
+
+```js
+{
+  "extends": "@parcel/config-default",
+  "transformers": {
+    "*.md": [ "parcel-transformer-markdown" ]
+  }
+}
+```
+
+`index.html`:
+
+```html
+<!DOCTYPE html>
+<div id="root"></div>
+<script type="module" src="index.js"></script>
+```
+
+**Output HTML string**
+
+Import your markdown files! Output HTML string.
+
+```js
+import HTMLStr from './Markdown.md';
+
+console.log(HTMLStr) // => Output HTML string.
+document.body.innerHTML = HTMLStr;
 ```
 
-Import your markdown files!
+**Output Markdown string**
+
+```js .markedrc
+{
+  "marked": false
+}
+```
 
 ```js
-import MarkdownString from './Markdown.md';
+import str from './Markdown.md';
 
-console.log(MarkdownString) // => Output markdown string.
+console.log(str) // => Output Markdown string.
+document.body.innerHTML = str;
 ```
 
-If you want to convert directly to HTML, you need to set [marked](https://github.com/markedjs/marked) options in [package.json](example/package.json).
 
-```json
+## Configuration
+
+[Marked](https://github.com/markedjs/marked) can be configured using a `.markedrc`, `.markedrc.js`, or `marked.config.js` file. See the [Marked API Reference](https://marked.js.org/using_advanced#options) for details on the available options.
+
+> Note: `.markedrc.js` and `marked.config.js` are supported for JavaScript-based configuration, but should be avoided when possible because they reduce the effectiveness of Parcel's caching. Use a JSON based configuration format (e.g. `.markedrc`) instead.
+
+There is a `marked` configuration that converts `markdown` to `HTML`. Otherwise just read the `markdown` string.
+
+```js
 {
-  "name": "example",
   "marked": {
     "breaks": true,
     "pedantic": false,
@@ -34,22 +85,10 @@ If you want to convert directly to HTML, you need to set [marked](https://github
     "smartLists": true,
     "smartypants": false,
     "xhtml": false
-    // ...
-  },
+  }
 }
 ```
 
-Import Markdown output HTML!
-
-```js
-import HTMLString from './Markdown.md';
-
-console.log(HTMLString) // => Output HTML string.
-document.body.innerHTML = html;
-```
-
-### Test
+## License
 
-```bash
-npm run test
-```
+MIT © [Kenny Wong](https://wangchujiang.com)
diff --git a/example/.markedrc b/example/.markedrc
@@ -0,0 +1,12 @@
+{
+  "marked": {
+    "breaks": true,
+    "pedantic": false,
+    "gfm": true,
+    "tables": true,
+    "sanitize": false,
+    "smartLists": true,
+    "smartypants": false,
+    "xhtml": false
+  }
+}
diff --git a/example/.npmignore b/example/.npmignore
diff --git a/example/.parcelrc b/example/.parcelrc
@@ -0,0 +1,6 @@
+{
+  "extends": "@parcel/config-default",
+  "transformers": {
+    "*.md": ["parcel-transformer-markdown"]
+  }
+}
diff --git a/example/package.json b/example/package.json
@@ -1,28 +1,19 @@
 {
   "name": "example",
   "version": "1.0.0",
+  "private": true,
   "description": "",
   "main": "index.js",
   "scripts": {
-    "start": "NODE_ENV=development parcel src/index.html --out-dir dist/ --no-cache",
-    "build": "NODE_ENV=production parcel build src/index.html --out-dir dist/ --public-url ./ --no-cache"
+    "start": "rm -rf .parcel-cache && parcel src/index.html",
+    "build": "parcel build src/index.html --dist-dir doc"
   },
   "keywords": [],
   "author": "",
   "license": "ISC",
-  "marked": {
-    "breaks": true,
-    "pedantic": false,
-    "gfm": true,
-    "tables": true,
-    "sanitize": false,
-    "smartLists": true,
-    "smartypants": false,
-    "xhtml": false
-  },
   "devDependencies": {
-    "parcel-bundler": "^1.10.3",
-    "parcel-plugin-markdown-string": "file:../",
-    "posthtml-parser": "^0.4.1"
+    "parcel": "^2.2.0",
+    "parcel-transformer-markdown": "file:../",
+    "posthtml-parser": "^0.10.1"
   }
 }
diff --git a/example/src/index.html b/example/src/index.html
@@ -11,7 +11,7 @@
 </head>
 
 <body>
-  <script src="./index.js"></script>
+  <script type="module" src="./index.js"></script>
 </body>
 
 </html>
diff --git a/index.js b/index.js
-Original file line number
+Diff line change
@@ Expand Up / @@ -11,7 +11,7 @@ @@
     </head>
     <body>
-      <script src="./index.js"></script>
+      <script type="module" src="./index.js"></script>
     </body>
     </html>