.github/workflows/nodejs.yml

@@ -9,12 +9,12 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [8.x, 10.x, 12.x]
+        node-version: [10.x, 12.x, 14.x, 16.x]
 
     steps:
-    - uses: actions/checkout@v1
+    - uses: actions/checkout@v3
     - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v1
+      uses: actions/setup-node@v3
       with:
         node-version: ${{ matrix.node-version }}
     - name: npm install, build, and test

README.md

@@ -1,6 +1,7 @@
-# frontmatter-markdown-loader [![frontmatter-markdown-loader Dev Token](https://badge.devtoken.rocks/frontmatter-markdown-loader)](https://devtoken.rocks/package/frontmatter-markdown-loader)
+# frontmatter-markdown-loader
 
 [![npm](https://img.shields.io/npm/v/frontmatter-markdown-loader.svg?style=for-the-badge)](https://www.npmjs.com/package/frontmatter-markdown-loader)
+[![GitHub Workflow Status](https://img.shields.io/github/workflow/status/hmsk/frontmatter-markdown-loader/Node%20CI?style=for-the-badge)](https://github.com/hmsk/frontmatter-markdown-loader/actions?query=workflow%3A%22Node+CI%22)
 
 Webpack Loader for [Front Matter](https://jekyllrb.com/docs/front-matter/) files (.md) which returns:
 
@@ -31,14 +32,22 @@ import fm from "something.md"
 fm.attributes // FrontMatter attributes => { subject: "Hello", tags: ["tag1", "tag2"] }
 fm.html // Compiled markdown as HTML => "<h1>Title</h1>\n<p>message</p>\n"
 fm.react // Component function for React which renders compiled markdown (Disabled as default)
-fm.vue.compoennt // Extendable component object for Vue which renders compiled markdown (Disabled as default)
+fm.vue.component // Extendable component object for Vue which renders compiled markdown (Disabled as default)
 ```
 
 📚 See the [documentation](https://hmsk.github.io/frontmatter-markdown-loader/) for the further detail.
 
-## 🔰 You have trouble with missing object?
+<details>
+<summary>🔰 You have trouble with missing object?</summary>
 
 The loader got the breaking changes in the latest major update. The article which you referred might premise on the old version. Check the installed version, if that says `1.x.y`, see [this guide](https://hmsk.github.io/frontmatter-markdown-loader/migration).
+</details>
+
+## Samples
+
+- [vue-cli app](https://github.com/hmsk/frontmatter-markdown-loader-vue-sample)
+- [Nuxt.js](https://github.com/hmsk/frontmatter-markdown-loader-nuxt-sample)
+- [NextJS (w/ Netlify CMS)](https://www.netlifycms.org/docs/nextjs/)
 
 ## Inspired/Referred
 

docs/.vuepress/config.js

@@ -14,21 +14,29 @@ module.exports = {
           ['/', 'Setup'],
           ['/options', 'Options'],
           ['/react', 'React Component'],
-          ['/vue', 'Vue Compoent/Renderers']
+          ['/vue', 'Vue Component/Renderers']
         ]
       },
       {
         title: 'Samples',
         collapsable: false,
         children: [
+          ['/samples-react', 'React App'],
           ['/samples-vue', 'Vue App']
         ]
       },
+      {
+        title: 'TypeScript',
+        collapsable: false,
+        children: [
+          ['/typescript', 'Type declarations'],
+        ]
+      },
       {
         title: 'Migration',
         collapsable: false,
         children: [
-          ['/migration', 'Migration from 1.x'],
+          ['/migration', 'When you update major version'],
         ]
       }
     ]

docs/index.md

@@ -23,7 +23,7 @@ fm.attributes //=> { subject: "Hello", tags: ["tag1", "tag2"] }
 fm.html //=> "<h1>Title</h1>\n<p>message</p>\n"
 ```
 
-And there are [some convenience features for Vue stack](vue) 😉
+And there are [some convenience features for Vue stack](./vue) 😉
 
 ## Setup
 

docs/migration.md

@@ -1,4 +1,60 @@
-# Migration from 1.x
+# Migrate to `3.*`
+
+If you're using `vue.component`, `vue.render` or `vue.staticRenderFns` by importing. The upgrade may affect your project.
+
+On the template for Vue component by compiling markdown,
+
+- Source attributes for `img`, `video`, `source`, `image`, `use` tag
+- `![alt text](Image URL)` on Markdown
+
+are transformed as Webpack env's assets like `require(originalPath)` as default. So, check each element is working as you intended.
+
+To disable this transformation, give `vue.transformAssetUrls: false`.
+
+```js
+{
+  test: /\.md$/,
+  loader: 'frontmatter-markdown-loader'
+  options: {
+    mode: [Mode.VUE_COMPONENT]
+    vue: {
+      transformAssetUrls: false
+    }
+  }
+}
+```
+
+And `vue.render`, `vue.staticRenderFns` becomes to return functions instead of string of functions.
+
+```diff
+import fm from "something.md"
+import OtherComponent from "OtherComponent.vue"
+
+export default {
+  data () {
+    return {
+      templateRender: null
+    }
+  },
+
+  components: {
+    OtherComponent // If markdown has `<other-component>` in body, will work :)
+  },
+
+  render (createElement) {
+    return this.templateRender ? this.templateRender() : createElement("div", "Rendering");
+  },
+
+  created () {
+-    this.templateRender = new Function(fm.vue.render)();
+-    this.$options.staticRenderFns = new Function(fm.vue.staticRenderFns)()
++    this.templateRender = fm.vue.render;
++    this.$options.staticRenderFns = fm.vue.staticRenderFns;
+  }
+}
+```
+
+# Migrate to `2.*`/`3.*` from `1.*`
 
 From `2.0.0`, `mode` is added to load contents selectively. That was breaking change but compresses the build size a lot.