Closed
Description
- OS: Windows 10
- Node.js: v9.3.0
- VuePress: 0.8.4
- Browser: Google Chrome Version 66.0.3359.117 (Official Build) (64-bit)
- Local installation
- Package Manager used: yarn
I'm using VuePress for documenting my components. For demo, purpose I'm registering it globally in enhanceApp.js and using it .md files.
Attaching a reproducible project with a custom component.
I have used yarn to install dependecies.
To reproduce:
- Go to
src/components/MyComponent.js. - Toggle the
returnstatement to see the output.
To view docs: run yarn docs:dev
I guess the problem is that it VuePress doesn't have babel-plugin-transform-vue-jsx. So is this thing in roadmap, or will not be supported? Is there any other way to handle JSX in render function for VuePress
If I use createElement method directly with arguments, its rendering properly.
export default {
name: 'my-component',
render (h) {
return h('div', {}, this.$slots.default)
}
}Now in my .md files if I use
<se-container>Hello World</se-container>Its working correctly.
But if I use JSX in render method, then it's showing ReferenceError: React is not defined in console.
export default {
name: 'my-component',
render (h) {
return (
<div>{this.$slots.default}</div>
)
}
}