How to add JSX Support to Existing MVC .NET Application

Hello All,

Most of the resources and examples for this plug-in assume that the application we are using is a new application that supports NPM/Node or Yarn. In some cases, we have existing MVC applications build on older versions of .NET or Visual Studio and the technical lift to reengineer it would be to great.

It would be helpful if there was a way to transcompile Vue JSX without all these component much like the way BabelJS works for React. Can this plug-in be used with just the .JS version? Any articles or walkthroughs that explains this would be great.

I found a minified version of his plugin here, but when I try to use the following script tag, nothing happens. No errors are emitted either. (Note: I set the script's tag to "text/babel" because I assumed that it worked like it would for React using BabelJS. If there is a different script type value that I should be using, please specify.)

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Vue JSX Example</title>
</head>
<body>
    <div id="content"></div>

    <script type="text/javascript" src="https://npmcdn.com/vue@2.6.10/dist/vue.js"></script>
    <script type="text/javascript" src="https://npmcdn.com/babel-plugin-transform-vue-jsx@3.7.0/dist/babel-plugin-transform-vue-jsx.min.js"></script>
    <script type="text/babel">
        new Vue({
            el: '#content',
            render: function (h) {
                return (<div level={1}><span>Hello</span> world!</div>);
            }
        });
    </script>
</body>
</html>

vuejs / babel-plugin-transform-vue-jsx

How to add JSX Support to Existing MVC .NET Application #189