Как набрать JSX с другими типами, чем React $ Element с flowtype?

Question

Я использую flowtype с Vue.js, и я добавил объявления типа для Vue.js. Затем я также использую синтаксис JSX с babel-plugin-transform-vue-jsx.

Alghough Я хочу набирать теги JSX как VNode, механизм потока определяет JSX-тег как React $ Element, поэтому он не работает.

Есть ли кто-нибудь, кто знает способ иметь механизм потока, обнаруживает JSX как другой тип или знает другой хороший способ решить эту проблему?

Мне нужна ваша помощь.

спасибо.

Всего кодов здесь. https://github.com/kentrino/vue-js-webpack-flowtype-example

import style from './Test.css'; 

const test: ComponentOptions = { 
    render (h): VNode { 
    return <div><h1 class={style.red}>Yeah!! This is test.</h1></div> 
//   ^^^^^ React$Element. This type is incompatible with 
//   5: render (h: any): VNode { 
//         ^^^^^ VNode 
    }, 
    name: 'Test' 
} 

Answer 1

Вы можете сделать Flow использовать что-то другое, чем React для проверки типов ваш JSX. Просто поместите @jsx тег в верхней части файла (я поставил мину прямо под тегом потока)

// @flow 
// @jsx somethingBesidesReact.createElement 

В вашем случае, вы используете Vue и babel-plugin-transform-vue-jsx плагин для преобразования вашего JSX, который просто переводит к h

https://github.com/vuejs/babel-plugin-transform-vue-jsx

Таким образом, в вашем случае, это должно работать

// @flow 
// @jsx h 
import style from './Test.css'; 

const test: ComponentOptions = { 
    render (h: any): VNode { 
    return <div><h1 class={style.red}>Yeah!! This is test.</h1></div> 
    }, 
    name: 'Test' 
} 

export default test;