vue.js使用JSX语法扩展

JavaScript XML

JSX 是一个看起来很像 XML 的 JavaScript 语法扩展

不同版本需要装不同的依赖

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

测试发现 vue 4.2.3 可以直接使用jsx语法

vue -V
@vue/cli 4.2.3

vue create vue-jsx-demo

src/App.vue

<template>
    <div id="app">
        <HelloWorld />
    </div>
</template>

<script>
import HelloWorld from "./components/HelloWorld.vue";

export default {
  name: "App",

  components: {
    HelloWorld
  }
};
</script>

src/components/HelloWorld.vue

<script>
export default {
  name: "HelloWorld",

  render() {
    return <h2>Hello JSX</h2>;
  }
};
</script>