dohzoh/example.vue

## example.vue
<template>
  <div @click="changeName()">
    Hello, {{name}}.
  </div>
</template>

<script>
export default {
  data() {
    return {
      name: "world"
    };
  },
  methods: {
    changeName() {
      this.name = "foobar";
    }
  }
};
</script>

<style lang="less" scoped>
div {
  font-weight: bold;
  color: red;
}
</style>

## index.html
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>VueJS Component Test</title>
  <script src="https://unpkg.com/vue"></script>
</head>

<body>
  <div id="wrapper">
    <my-component></my-component>
  </div>
</body>
<script type="module">
    import App from "./src/example.js";

    var app = new Vue({
      el: '#wrapper',
      components: {
        myComponent: App,
      },
    });
</script>
</html>
	<template>
	<div @click="changeName()">
	Hello, {{name}}.
	</div>
	</template>

	<script>
	export default {
	data() {
	return {
	name: "world"
	};
	},
	methods: {
	changeName() {
	this.name = "foobar";
	}
	}
	};
	</script>

	<style lang="less" scoped>
	div {
	font-weight: bold;
	color: red;
	}
	</style>
	<!DOCTYPE html>
	<html lang="en">

	<head>
	<meta charset="UTF-8">
	<title>VueJS Component Test</title>
	<script src="https://unpkg.com/vue"></script>
	</head>

	<body>
	<div id="wrapper">
	<my-component></my-component>
	</div>
	</body>
	<script type="module">
	import App from "./src/example.js";

	var app = new Vue({
	el: '#wrapper',
	components: {
	myComponent: App,
	},
	});
	</script>
	</html>