javascript - Laravel + React (Typescript/Javascript) - 如何编译任何带有扩展文件（js、jsx、ts、tsx）的模块？

Question

我有文件：root.tsx

import React, { Component } from 'react'
import Container from './apps/Container'
import Wrap from './apps/Wrap'

export default class Root extends Component {

 render() {
 console.log('load root.tsx')
  return (
   <div>
    aaaa
    <Container />
    <Wrap />
   </div>
  )
 }
}

和文件 app.tsx：

import React from 'react'
import ReactDOM from 'react-dom'
import RootApplication from './root'
ReactDOM.render(<RootApplication />, document.getElementById('root'))

我已经尝试同时加载两个代码 webpack.mix.js

const mix = require('laravel-mix');

/*
 |--------------------------------------------------------------------------
 | Mix Asset Management
 |--------------------------------------------------------------------------
 |
 | Mix provides a clean, fluent API for defining some Webpack build steps
 | for your Laravel application. By default, we are compiling the Sass
 | file for the application as well as bundling up all the JS files.
 |
 */

mix.react('resources/js/app.js', 'public/js')
   .ts('resources/js/app.tsx  ', 'public/js/')
   .sass('resources/sass/app.scss', 'public/css');

但这是多余的。如何使用一行代码但可以从文件 js jsx ts tsx 加载模块

标签： javascriptreactjslaraveltypescript