Skip to content
This repository has been archived by the owner on Mar 4, 2023. It is now read-only.

Commit

Permalink
docs: Update instructions for configuring Gridsome to use the Vue run…
Browse files Browse the repository at this point in the history
…time compiler

This can be done by setting a config option exposed by Gridsome.
  • Loading branch information
CMeeg committed Nov 17, 2019
1 parent c606fb5 commit b3b93fb
Showing 1 changed file with 7 additions and 5 deletions.
12 changes: 7 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -55,14 +55,16 @@ plugins: [

### Configure Gridsome to resolve Rich Text fields using Vue single file components

Configure Gridsome to use the "[Runtime + Compiler](https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only)" build of Vue because we will need the compiler to enable us to treat the Rich Text field content as a Vue component template.
First, [configure Gridsome](https://gridsome.org/docs/config/#runtimecompiler) to use the "[Runtime + Compiler](https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only)" build of Vue because we will need the compiler to enable us to treat the Rich Text field content as a Vue component template.

In your `gridsome.server.js` file:
In your `gridsome.config.js` file:

```javascript
api.configureWebpack(config => {
config.resolve.alias['vue'] = 'vue/dist/vue.common';
})
module.exports = {
...
runtimeCompiler: true
...
}
```

Add a Vue single file component that will be used to render Rich Text fields. This component is a wrapper around [`v-runtime-template`](https://github.com/alexjoverm/v-runtime-template) and will be extended to resolve other components embedded inside your Rich Text fields e.g. content components/items, content links and assets.
Expand Down

0 comments on commit b3b93fb

Please sign in to comment.