Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

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

Open
rashadrivera opened this issue Nov 10, 2019 · 0 comments
Open

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

rashadrivera opened this issue Nov 10, 2019 · 0 comments

Comments

@rashadrivera
Copy link

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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@rashadrivera