如何在 tsx 文件上使用 Vue

Question

index.tsx

import Vue from 'vue'
new Vue({
    render() {
        return <div id="app">hello world</div>
    }
}).$mount('#app')

webpack.js

const path = require('path');
module.exports = {
    resolve: {
        extensions: ['.tsx', '.ts', '.js', '.vue', '.json'],
        alias: {
            'vue$': 'vue/dist/vue.esm.js'
        }
    }
};

网络上大部分的教程都是在 .vue 文件中使用 script 标签添加 tsx lang 实现,如何直接在 tsx 中编写 Vue？

Answer 1

import { Vue, Component } from 'vue-property-decorator';

@Component
export default class CommonView extends Vue {
  public render() {
    return <div />;
  }
}

命名为tsx后缀就好了